html - 如何将样式应用于超越其他元素边界的一段文本？

Question

假设我有以下段落:

<p>one two </p> <p> three </p><p> four five </p>

现在假设我想在适当的位置设置单词 2、3 和 4 green 的样式，而不会对文档的结构或其他布局产生任何其他影响。我基本上想要一个 <span>超越 block 级元素，如 <p>秒。我怎样才能最简单地完成这个？我可以

<p>o <span>t</span></p><p><span>t</span></p><p><span>f</span> f</p>

但这让事情变得非常困惑，因为我使用了 Markdown 解析器并拥有自己的自定义预处理代码。我该怎么做才能让每个连续长度的绿色文本只有一个“样式开始”标记和一个“样式结束”标记？

Answer 1

您可以将文本包裹在一个 <p> </p> 中并且有一个<span>在你想要设置样式的文本周围，所以:

<p>one <span>two three four</span> five</p>

http://jsfiddle.net/asbd9rdj/

编辑

在多个 <p></p> 中定位特定的词标签，使用 <span></span>作为内联元素，因此您可以为其附加样式。

<p>one <span>two</span></p>
<p>three <span>four</span></p>

此处示例:http://jsfiddle.net/79be8L6L/