html中设置段落缩进2字符,css首行缩进2字符怎么设置？
在css中，我们可以使用text-indent属性来实现首行缩进效果，本篇文章就来带大家了解text-indent属性是怎样设置首行缩进样式的。有一定的参考价值，有需要的朋友可以参考一下，希望对大家有所帮助。
首先我们来了解一下有关于css text-indent属性的相关知识。
text-indent 属性可以设置文本块(块级元素)中首行文本的缩进；它允许使用负值，但如果使用了负值，那么首行会被缩进到左边。
注意：在 CSS 2.1 之前，text-indent 总是继承计算值，而不是声明值。
下面介绍一下text-indent属性可以通过下面的属性值来设置首行的缩进：length：定义固定的缩进，默认值为0。
%：定义基于父元素宽度的百分比的缩进。
我们通过简单的代码示例来看看效果：
首行缩进
.demo{
width: 500px;
height: 200px;
margin: 50px auto;
}
.p1{
text-indent:36px;
}
.p2{
text-indent:10%;
}
demo盒子宽500px时：
这是一段测试代码，是关于css文本缩进的一段文字。这是一段测试代码，
是关于css文本缩进的一段文字。这是一段测试代码，是关于css文本缩进的一段文字。
这是一段测试代码，是关于css文本缩进的一段文字。这是一段测试代码，是关于css文本缩进的一段文字。
这是一段测试代码，是关于css文本缩进的一段文字。text-indent:36px;
这是一段测试代码，是关于css文本缩进的一段文字。这是一段测试代码，
是关于css文本缩进的一段文字。这是一段测试代码，是关于css文本缩进的一段文字。这是一段测试代码，
是关于css文本缩进的一段文字。这是一段测试代码，是关于css文本缩进的一段文字。这是一段测试代码，
是关于css文本缩进的一段文字。text-indent:10%;
效果图：
第一个p标签内的段落文本缩进效果没有改变，但第二个p标签内的段落文本缩进长度变大了，可以看出用%设置的缩进是根据父元素的大小改变的。
下面我们就来看看css如何实现首行缩进2个字符效果：
首行缩进
.demo{
width: 550px;
height: 200px;
margin: 50px auto;
}
p{
text-indent:2em;/*em是相对单位，2em即现在一个字大小的两倍*/
}
}
这是一段测试代码，是关于css文本缩进的一段文字。这是一段测试代码，是关于css文本缩进的一段文字。
这是一段测试代码，是关于css文本缩进的一段文字。这是一段测试代码，是关于css文本缩进的一段文字。
这是一段测试代码，是关于css文本缩进的一段文字。这是一段测试代码，是关于css文本缩进的一段文字。
效果图：
在这里我们使用到了一种长度单位em，那么什么是em?
em是一种相对长度单位，相对于当前对象内文本的字体尺寸。而我们中文段落一般每段前空两个汉字，实际上，就是首行缩进了2em。
html中设置段落缩进2字符,css首行缩进2字符怎么设置？相关推荐
- html打印预览首行缩进样式无效,css首行缩进没有效果的原因及解决办法
css首行缩进没有效果的原因及解决办法 发布时间:2020-12-23 09:52:37 来源:亿速云 阅读:69 作者:小新 这篇文章将为大家详细讲解有关css首行缩进没有效果的原因及解决办法,小编 ...
- html首行缩进怎么弄,css首行缩进怎么弄
css首行缩进的设置方法:首先新建一个html代码文件:然后给 设置一个class类:接着在 设置样式.在 标签后面新建一个 使用浏览器打开,即可看到首行缩进的效果.如图: 所有代码.直接复制所有代码 ...
- css缩2个字,css首行缩进2字符怎么设置?缩进的CSS代码是什么
本篇文章给大家带来的内容是关于css首行缩进2字符怎么设置?缩进的CSS代码是什么,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助. 1.首先应用缩进CSS属性:text-indent ...
- css首行缩进字符间距行高_黑暗代码风格的学院：换行，间距和缩进
css首行缩进字符间距行高 Hey guys! Let me walk you through the next part of our dark-style code academy. In thi ...
- 文章p标签css首行缩进text-indent后，图片img怎么设置不缩进解决办法
文章p标签css首行缩进text-indent后,图片img怎么设置不缩进解决办法 段落前面空两个字的距离,不要再使用空格了.应该使用首行缩进text-indent. text-indent可以使得容 ...
- css首行缩进(css首行缩进)
首行缩进连个字符和首行缩进连个字是一样的概念?首行缩进连个字符和 不一样的概念啊,字符和字是不一样的 如何在css中控制段落的首行缩进??如何在css中控制段落的首行 style="text ...
- CSDN中markdown字体颜色，大小，首行缩进，居中排布
一.下面是首行缩进的两种方法 1.这里实用空格去替代缩进的字符,下面讲的替代包括分号 2.把输入法由半角改为全角. 两次空格之后就能够有两个汉字的缩进. 半方大的空白用 或 全方大的空白用 或 不 ...
- css首行缩进2个空格相对大小
有时候段落文本需要首行缩进两个空格,可以通过text-indent属性设置,单位em表示相对当前行文本大小缩进,例如当前文字大小是10px,那么2em就是相当于首行缩进了10xp*2=20px,也就是 ...
- css首行缩进（微信开发采坑随便）
一开始设置微信小程序首行缩进两个字不生效,查找原因是应为使用了容器造成的,改为ro容器完美解决,
最新文章
- 用单片机测量流体流速的_流量计是测量液体、气体流量仪表原理安装
- Spring boot 启动后执行特定的操作
- 矩阵分析与多元统计11 广义vec算子与devec算子
- （Mybatis）缓存
- 前端学习（1663）：前端系列实战课程之禁止保存
- BizTalk Server 2010 + SQL Server 2008 R2 - 通过集成创造更大价值 [ 上篇 ]
- linux和windows下icmp的区别
- ie8 html5上传,兼容IE8的file单文件上传（jquery.form+formdata）
- 上传文件submit提交form表单 success返回数据多了div获取不到正确的返回数据
- mfc chartctrl 饼状图编写_南瓜糯米饼：外酥里糯，吃到嘴巴里，真是舌尖上的享受...
- env: bash\r: No such file or directory
- 非对称加密-区块链核心技术之一
- fastJson与String、对象、集合之间相互转换
- 手把手教你使用Java生成助记词、私钥、地址｜Java区块链钱包生成助记词、地址
- css画三角形、梯形
- 关于kali连不上网络
- 工作中常用的JS函数整理分享（欢迎大家补充）
- insserv: Starting xx depends on plymouth and therefore on system facility `$all'
- Linux项目开发—电子相册
- AppleScript 实现 imessage 批量推送 苹果推 (亲测通过)