我想在psuedo元素之前对齐一个li：：就像在执行一个
列表样式位置：外部
null
ul{
width: 300px;
}
.cool-list li{
list-style: none;
}
.cool-list li:before{
content:"\2716";
color: #000;
}<ul class="cool-list">
<li> item</li>
<li> One 'problem' with the Guardian's method <span style="background-color: yellow">is list items</span> </li>
<li> Item </li>
<li> Item </li>
</ul>null
我想对齐突出显示的部分。
负余量可以做到这一点。
null
ul {
width: 300px;
}
.cool-list li {
list-style: none;
}
.cool-list li:before {
content: "\2716";
color: #000;
margin-left: -20px;
}<ul class="cool-list">
<li> item</li>
<li> One 'problem' with the Guardian's method <span style="background-color: yellow">is list items</span> </li>
<li> Item </li>
<li> Item </li>
</ul>
您可以使用列表样式代替pseudo和pseuddo::marker来重置颜色：
null
ul{
width: 300px;
}
.cool-list li{
list-style: "\2716\0020"; /* add a white space ? */
}
li::marker {
color: crimson; /* give a different color to the list marker ? */
}
.cool-list li.good {
list-style:"\2714\0020";
}
li.good::marker {
color: green
}<ul class="cool-list">
<li> item</li>
<li> One 'problem' with the Guardian's method <span style="background-color: yellow">is list items</span> </li>
<li class="good"> Item </li>
<li> Item </li>
</ul>