html - 使用 CSS 插入文本

Question

我对 CSS 比较陌生，并且使用它来更改文本的样式和格式。

我现在想用它来插入如下所示的文本:

<span class="OwnerJoe">reconcile all entries</span>

我希望我可以显示为:

Joe 的任务:核对所有条目

也就是说，仅仅由于属于“Owner Joe”类，我想要文本 Joe's Task:显示出来。

我可以用如下代码做到这一点:

<span class="OwnerJoe">Joe's Task:</span> reconcile all entries.

但这对于指定类和文本来说似乎是非常多余的。

是否有可能做我正在寻找的事情？

编辑 一个想法是尝试将其设置为 ListItem <li>其中“子弹”是文本“乔的任务”。我看到了如何设置各种子弹样式甚至子弹图像的示例。列表元素符号可以使用一小段文本吗？

Answer 1

可以，但需要支持 CSS2 的浏览器(所有主流浏览器，IE8+)。

.OwnerJoe:before {
  content: "Joe's Task: ";
}

但我宁愿推荐使用 Javascript。使用 jQuery:

$('.OwnerJoe').each(function() {
  $(this).before($('<span>').text("Joe's Task: "));
});