如何在div+css实现首行缩进

作者:课课家教育更新于： 2016-10-19 17:14:46

      用word文档实现段落首行缩进是一件相当容易的事，你只需打开段落对话框，在里面进行相关设置即可。那么在div+css中该如何实现呢?今天我们一起来学习一下。

　　所谓首行缩进，就是每段前空两个汉字。所以在学习div+css之初，小编用了一个最简单粗暴的方法，就是在段落前面加四个小角空格。如果我们不使用空格呢？那要怎么办呢？解决之道非常简单就是使用text-indent属性，具体有两种方法：

　　第一种：直接对p进行定义

　　注：div标签不要忘记起始符。text-indent只对p或div标签有效，对br标签不生效，原因是br标签是换行标签不是分段标签。 

　　第二种:在style里定义

　　这种方法只需在style里定义如下缩进样式：.suojin{text-indent:2em} ，然后在需要缩进的地方使用class="suojin"即可。

　　比如用一个div定义一整块段落首行缩进， 凡在div区域里，浏览器一碰上p语句（即一个新段的开始），就会执行.suojin所定义的缩进。 

　　代码如下：

　　当然也可以在正文中使用嵌入式CSS样式来定义：

       以上就是在div+css中实现首行缩进的两种办法，非常简单！

　　大部分网站都会使用首行缩进让文章每个自然段的开头缩进两个文字以符合读者的正常阅读习惯，所以这是特别常用的一个样式。对于Web开发者来说，想必没什么属性比这个更重要了，初学者们一定要熟练掌握喔!