在<li> s </li>之间插入一些字符

Question

我有一个生成一些html和回声的框架。在特定情况下，框架会生成一个HTML编号：

<ul>
     <li class="foo">A</li>
     <li class="foo">B</li>
     <li class="foo">C</li>
</ul>

以A B C的内嵌方式显示。如何更改CSS代码中的foo类，使文本显示为A * B * C？

Answer 1

模块浏览器支持，你应该可以使用:first-child：

.foo::before {
    content: "* "
}
.foo:first-child::before {
    content: ""
}

示例：

.foo {
  display: inline-block;
}
.foo::before {
  content: "* "
}
.foo:first-child::before {
  content: ""
}

<ul>
     <li class="foo">A</li>
     <li class="foo">B</li>
     <li class="foo">C</li>
</ul>

Answer 2

＆＃13;

＆＃13;

li.foo::after {content: '*'}
li.foo:last-child::after {content: ''}

＆＃13;

<ul>
     <li class="foo">A</li>
     <li class="foo">B</li>
     <li class="foo">C</li>
</ul>

＆＃13;

＆＃13;

＆＃13;