Html 使用：before和：after创建div的内容

我有一个

div

元素，我想根据它的类将内容插入其中

我可以使用CSS中的

：before

和

：after

属性将2个元素插入该

div

，但我需要能够插入至少5个元素

以下是我为2准备的：

div {
  background: blue;
  margin: 0 auto;
  width: 50px;
  height: 50px;
  padding: 0;
  display:table-cell;
  vertical-align:middle;
  text-align: center;
}

div:after {
  content:'';
  display:block;
  border:1px solid #000;
  width:40px;
  height:40px;
  margin:5px auto;
  background-color:#DDD;
}
div:before {
  content:'';
  display:block;
  border:1px solid #000;
  width:40px;
  height:40px;
  margin:5px auto;
  background-color:#DDD;
}

---

我有没有办法在之前和之后创建额外的

？类似于
div:after:after
的注释，在CSS中无法获得：after:after

尽管您可以在jQuery中通过

看

尽管它使用jQuery，但它是一个更有效的解决方案，因为实际上您应该只使用：before和：after CSS选择器进行样式设置
不，很抱歉您不能

阅读有用：

只需在元素中添加一些元素

HTML:

<div>
    <div>
    </div>    
</div>

div:after {
    content:'1';
}
div > div:after {
    content:'2';
}

content
属性，尽管其名称不应用于添加/显示实际内容，但其目的是设置样式或添加某些效果。但是，你的问题的答案是，没有……没有其他的伪元素。我没有，但也许最好用HTML/jQuery元素替换*

/

*之前的*

/

*之后的短语。@Hashem，如果我不知道他想附加什么前缀，很难做到，这将是为他编写代码。@Sam如果他们能够使用jQuery，他们可以正确插入内容，而不是使用伪元素。这个答案有点多余。
div:after {
    content:'1';
}
div > div:after {
    content:'2';
}