html首行缩进在CSS中的代码,如何在div+css实现首行缩进

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

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

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

text-indent:2em;/*em是相对单位，2em即现在一个字大小的两倍*/

}

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

第二种:在style里定义

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

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

代码如下：

段落一

段落二

段落三

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

段落一

段落二

段落三

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

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

html首行缩进在CSS中的代码,如何在div+css实现首行缩进相关推荐

css中怎么代码可以换行吗,css强制换行代码怎么写？
自动换行问题,正常字符的换行是比较合理的,而连续的数字和英文字符常常将容器撑大,确实挺让人头疼的,下面就来介绍下CSS如何实现换行的方法. 强制不换行 div{ white-space:nowrap; ...
php图片下载代码,php下载css中图片代码
提供一个常见的php下载css中图片代码,有需要的朋友可以下载,只要把$url填写好就行了哈. 代码如下复制代码 $host = $host[1]; if (!is_dir('img')) { m ...
前端开发css中怎么让图片居中？css图片居中的方法总结
在进行网页布局的时候,有时候图片的位置可能会影响整个页面的美观程度,所以对于图片的放置位置就得变化,那么,接下来的这篇文章将给大家来介绍关于图片在网页中如何使用css实现居中的方法,对于有需要的朋友来 ...
css中怎么让图片居中？css图片居中的方法总结
在进行网页布局的时候,有时候图片的位置可能会影响整个页面的美观程度,所以对于图片的放置位置就得变化,那么,接下来的这篇文章将给大家来介绍关于图片在网页中如何使用css实现居中的方法,对于有需要的朋友来 ...
一篇文章教你学会如何使用CSS中的雪碧图（CSS Sprite）
一篇文章教你学会如何使用CSS中的雪碧图(CSS Sprite) 一.什么是雪碧图? 雪碧图(CSS Sprite)又叫CSS精灵图,是一种网页图片应用处理方式,他允许你将一个页面设计到所有零星图片 ...
html中如何写新闻题目,DIV CSS布局短栏目与新闻标题列表布局模块代码
DIV CSS布局短栏目与新闻标题列表布局模块代码,在线演示与完整源代码下载,常见网页短栏目名称与新闻列表布局模板实例代码,模块CSS代码. css div模块新闻列表布局效果截图此局部DIV C ...
Vue3新属性 — css中使用v-bind（v-bind in css）
Vue3新属性:CSS 中的 v-bind() 写在前面: 本文主要介绍Vue3中的新增的v-bind()的常用使用方式,主要包括在css,less,scss中的使用,可以参考官方文档查看:Vue3官 ...
python代码块使用缩进表示-python中的代码块使用缩进来表示。
[填空题]Python 运算符中用来计算整商的是( ). (2.0分) [判断题]python中的多行语句可以使用反斜杠来实现. (2.0分) [填空题]在python中,int表示的数据类型是( ) ...
css中在图片上加透明,css 给图片添加滤镜效果，透明层毛玻璃效果
我们用的第一个滤镜是sepia(),他会给图片增加一整降饱和度的橙色染色效果原图添加sepia滤镜的效果 img{ width:100%; transition: .5s filter; filt ...

html首行缩进在CSS中的代码,如何在div+css实现首行缩进

html首行缩进在CSS中的代码,如何在div+css实现首行缩进相关推荐

最新文章

热门文章