仅缩进段落中的第一行文本？

我有几个段落，我想缩进，但只有这些段落的第一行。

我将如何定位使用CSS或HTML的第一行？

Answer 1

使用text-indent属性。

 p { text-indent: 30px; } 

jsFiddle 。

Answer 2

除了文本缩进之外，如果您希望应用其他样式，则可以使用:first-lineselect器。

 p:first-line { color:red; } p { text-indent:40px; } 

http://jsfiddle.net/Madmartigan/d4aCA/1/

Answer 3

使用CSS非常简单：

 p { text-indent:10px; } 

将在每个段落中创build10个像素的缩进。

Answer 4

我也遇到了问题，得到一个段落的第一行（只有第一行）缩进，并试图以下代码：

 p::first-line { text-indent: 30px; } 

这没有奏效。 所以，我在我的CSS中创build了一个类，并在我的html中使用它，如下所示：

在CSS中：

 .indent { text-indent: 30px; } 

在html中：

 <p class="indent"> paragraph text </p> 

这工作像一个魅力。 我仍然不知道为什么第一个代码示例没有工作，我确信文本没有alignment。

Answer 5

干得好：

 p:first-line { text-indent:30px; } 

没有看到一个CSS新手明确的答案，所以这是一个容易的。

Answer 6

我遇到了同样的问题，只有我有多个<p>标签，我不得不使用。 使用“文本缩进”属性想缩进所有的<p>标签，这不是我想要的。

我想添加一个奇特的报价图片的certificate书列表，基于CSS背景的图像在每个报价的开头和文本坐在图像的右侧。 由于text-indent导致所有后续段落缩进，不只是第一段，我不得不做一些解决方法。 如果你不想要做一个图像，同样的方法适用。

我通过首先添加一个空的div到我想要缩进的段落的开头来实现这一点。 接下来，我使用了一个小的宽度和高度来创build不可见的框，最后应用一个左浮动使其与文本内联。 如果你正在使用这个图像，请确保在右侧添加一个边距，或者使一些空白的宽度变宽一点。

这里是一个CSS内联的例子。 您可以轻松创build一个类并将其添加到您的CSS文件中：

 <div style="height: 25px; width: 25px; float: left;"></div> <p>First Paragraph</p> <p>Second Paragraph</p> 

Answer 7

首先缩进所有行（1），而不是第一行（2）

 padding-left: 0.4em /* (1) */ text-indent: -0.4em /* (2) */