定义：
text-indent 属性规定文本块中首行文本的缩进。
注意点：
text-indent 可以使用px、rem、em作为缩进单位。区别如下：
1、px是缩进固定的像素距离，不会根据应用到的元素字体的大小而调整。
2、rem根据根元素设置的字号，缩进固定的距离，不会根据应用到的元素字体的大小而调整。
3、em会根据应用到的元素字体的大小来调整距离。
如：
p{text-indent:2emfont-size:18px}//这种写法不管p里面的字号设置多大，p的首行总会缩进2个字的距离。也就是2*fontSize的距离
p{text-indent:20pxfont-size:18px}//假如p的字号改变为40px，那首行的缩进依然还是20px
text-indent: 2em
具体方法：
新建一个html代码文件，然后在这个html代码页面上创建一个<div>，同时给这个<div>设置一个class类；然后在这个<div>中创建几个<p>,并个<p>添加上内容。
代码：
<div class="cont">
<p>顶顶顶顶顶顶顶顶顶顶顶顶顶顶多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多</p>
<p>的顶顶顶顶顶的顶顶顶顶顶</p>
<p>顶顶顶顶顶顶顶顶顶顶顶顶顶顶多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多</p>
</div>
设置样式。在<title>标签后面新建一个<style>,在这个<style>设置cont类的宽为400px，然后设置p标签的首行缩进为两个字符。如图：
代码：
<style>
.cont{
width:400px
}
.cont p{
text-indent: 2em
}
</style>
使用浏览器打开，即可看到首行缩进的效果。如图：
所有代码。直接复制所有代码，粘贴到新建html文件上，保存后使用浏览器打开即可看到所有效果。
代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>首行缩进</title>
<style>
.cont{
width:400px
}
.cont p{
text-indent: 2em
}
</style>
</head>
<body>
<div class="cont">
<p>顶顶顶顶顶顶顶顶顶顶顶顶顶顶多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多</p>
<p>的顶顶顶顶顶的顶顶顶顶顶</p>
<p>顶顶顶顶顶顶顶顶顶顶顶顶顶顶多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多多</p>
</div>
</body>
</html>
扩展资料：
CSS text-indent属性规定文本块中首行文本的缩进。
注释：允许使用负值。如果使用负值，那么首行会被缩进到左边。
注意：在 CSS 2.1 之前，text-indent 总是继承计算值，而不是声明值。
用于定义块级元素中第一个内容行的缩进。这最常用于建立一个“标签页”效果。允许指定负值，这会产生一种“悬挂缩进”的效果。
所有浏览器都支持 text-indent 属性。
注释：任何的版本的 Internet Explorer （包括 IE8）都不支持属性值 "inherit"。
参考资料来源：百度百科：CSS text-indent
你好，在对应的css中写上 pdding-left:10px //10具体值可以自己调整
如果你设置了这个div的width宽度，width的值也相应减少10px，否则div可能变宽导致页面错位。
