首行缩进2字符怎么设置 css

html-css039

首行缩进2字符怎么设置 css,第1张

使用CSS的text-indent属性可以定义文本段落中的首行字体缩进的效果。使用该属性只对元素中的段落产生影响。对于使用<br>标签产生的换行效果，并不起作用。

1、在CSS样式表中设置文本首行缩进的样式规则。代码如下：

div{

 text-indent:2em

 font-size:24px

 width:400px

}

div标签选择器使用text-indent属性将段落首行缩进2em，这是两个汉字字符的宽度。使用font-size属性将字体大小设置为24px，使用width属性将div元素的宽度设置为400px，都是为了使效果能够更好地显示。

2. 在HTML网页中添加要使用标签选择器的div元素内容。代码如下：

<body>

<div>

<p>这段内容是一个文本首行字体缩进的实例，注意文本中段落首行部分的显示效果。</p>

<p>这段内容是一个文本首行字体缩进的实例，注意文本中段落首行部分的显示效果。</p>

</div>

div标签选择器直接应用到了相关的HTML div元素中，不再需要另外进行设置了。

3. 在浏览器中浏览文本首行缩进的显示效果。如下图所示：

从上图中可以看出，只要在父元素中定义了文本的缩进属性，在各个子元素中将继续继承这个缩进属性值。

要实现文本首行缩进，可使用css中的text-indent实现，示例代码如下：

HTML代码：

这里是第一段文字

这里是第二段文字

CSS代码：

p{text-indent:2em}

这样就可以实现首行自动缩进两个汉字字符。