Question

<ul>
    <li>number</li> 
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
</ul>

样式表：

ul {
    list-style-type: none
}

ul li {
    float: left;
}

li:after {
    content: ", "
}

li:before {
    content: ": "
}

li:last-child:after {
    content: "."
}

li:first-child:before {
    content: ""
}

结果是：

number, 1, 2, 3, 4, 5.

如何解决此问题：

number: 1, 2, 3, 4, 5.

Answer 1

添加：

li:first-child:after {
    content: ": "
}

Answer 2

尝试使用li:first-child:after {content: ": "}添加：在数字行之后 li:not(:first-child):after {content: ", "}也可以在任何其他行之后添加

完整的解决方案

ul {list-style-type: none}
ul li {float: left;}
li:not(:first-child):after {content: ", "}
li:last-child:after {content: "."}
li:first-child:after {content: ": "}

您可以查看dabblet要点：http://dabblet.com/gist/4681763

如何设置格式为“数字：1,2,3,4,5”的工作表？

2 个答案: