从第二段开始的文本缩进

Question

我有来自数据库的文本 ($row[text] )，看起来像：

<p>First</p>
<p>Second</p>
<p>Third</p>

我想从第 2 段开始申请 "text-indent"。我知道，它可以与 class 一起应用，例如：

.a{text-indent: 20px}

<p>First</p>
<p class="a">Second</p>
<p class="a">Third</p>

但是我不能那样做，因为我不能编辑数据库。当我使用 p{文本缩进：20px} 它适用于所有段落

Answer 1

您可以通过将 text-indent 应用于所有 p 标签，并在 first-child:

上删除它来实现

p{text-indent: 20px}
p:first-child{text-indent:0}

<p>First</p>
<p>Second</p>
<p>Third</p>

Answer 2

您可以使用第 nth-child 伪 class 来实现这一点。它也接受一个公式，将 n 替换为 0 等等，因此您的公式变为 2+n

p:nth-child(2+n){text-indent: 20px}

<p>First</p>
<p>Second</p>
<p>Third</p>

Answer 3

这取决于 p 元素的标记上下文和所需的排版实践。例如，如果 p 元素跟在列表之后，或者 table 元素是否应该缩进？意见不一。无论如何，一旦你决定了印刷策略，你可能可以使用 suitable 上下文选择器来处理它（除非你需要担心相当旧版本的 IE）。

在一个极端情况下，您只能在紧跟在另一段之后的段落缩进，因为这是真正需要缩进的上下文。由于您通常希望在使用缩进时防止段落之间的默认垂直间距，因此您可以使用

p + p { text-indent: 1em; }
p { margin: 0; }

（使用 em 单位优于 px，因为它适应字体大小的变化。通常 1em 就足够了。）

Text indent starting from 2nd paragraph