WordPress:用跨度包裹li内容

Question

我已经为ul标签添加了样式,以便子弹点将是不同的颜色.这个问题是它也改变了li内容的颜色,而我只打算改变子弹点颜色.

我尝试过使用pseudo造型,但效果不佳.

由于我使用的是WordPress li,因此它将在内容编辑器中,因此如果li标签中的所有内容都包含在内,span那么我就可以过滤掉li其中内容的样式.

我知道这可能是可能的,preg_replace但我仍然是PhP的新手.

这是我想要实现的一个例子:

<ul>
 <li>
  // Wordpress Add <span> Here
    Content Goes Here
  // Wordpress Add </span> Here
 </li>
</ul>

最终是否可以li使用后端功能和过滤器自动包装内容,而不是让用户手动将其添加到WordPress内容编辑器中？

我希望这对你有意义,我尽我所能.

CSS按要求提供

ul {
 color: #2e6c9e;
 padding-left: 22px;
}

ul li {
 color: #636466; // This does not work :(
}

注意:

我需要替代:before和:after

对于那些不清楚的人,我ul通过WordPress内容编辑器添加元素.由于这需要用户友好,我需要一种方法span在li内容之前滑入,以便没有技术知识的用户可以插入ul没有颜色冲突的用户.

Answer 1

我不认为你可以给一颗子弹上色<li>.所以你必须制作自己的子弹,你可以轻松地用CSS做到这一点.

这是我经常使用的一个示例:

li {
    position: relative;
    list-style: none;
}
li:before {
    position: absolute;
        top: -3px;
        left: -18px;
    content: "• ";
    font-size: 1.2em;
    color: #222;
}