css - 使用 CSS 像小说一样构建段落

Question

这是 CSS:

p + p {
 text-indent: 1.1em;
 margin-top: 0;
}
p {
 font-family: 'Crimson Text', serif;
 margin: 0;
}

HTML:

<p>...<p>
<p>...</p> (new paragraph)
<p><br><p>
<p></p> (new scene)

(这是 WordPress 的默认文本编辑器)

我不确定它是如何工作的(我从一个我不记得的网站上获取了它)。它产生这个:

只有一个问题。第三段是新场景，不应该缩进。我想知道是否有办法用 CSS 解决这个问题？ (CSS3 可以)

编辑:

我想 jQuery 是唯一的方法吗？使用 jQuery 有什么建议吗？

Answer 1

我会说把它组织成场景。

标记:

<div class="scene">
    <p>...</p>
    <p>...</p>
    <p>...</p>
</div>
<div class="scene">
    <p>...</p>
    <p>...</p>
    <p>...</p>
</div>

还有一些 CSS:

.scene p { text-indent: 1.1em; }
.scene p:first-child { text-indent: 0; }

这会清理您的标记，并实现全面的一致性。 (这也是 ie7/8 友好的)