CSS text-indent 属性
CSS text-indent 属性技术文档
介绍
CSS中的text-indent属性是用来设置文本缩进的,即在文本第一行开头处空出指定长度的空白。该属性适用于块级元素或块级容器中的第一行文本。
语法
text-indent: length | percentage | initial | inherit;
- length:指定一个正数值来设置文本缩进的长度。例如text-indent: 20px;
- percentage:指定一个百分数值来设置文本缩进的长度,基于元素宽度计算。例如 text-indent: 50%;
- initial: 将属性设置为默认值;
- inherit: 继承父元素的属性。
浏览器支持
text-indent 属性在所有的主流浏览器中得到支持,包括IE6及以上、Chrome、Safari、Firefox、Opera等。
实例
以下代码将会在一个段落的开头空出40px的缩进:
p {
text-indent: 40px;
}
以下代码将会在一个div的开头空出20%的缩进:
div {
text-indent: 20%;
}
注意事项
- text-indent属性仅适用于块级元素或块级容器中的第一行文本。如果元素或容器只包含一行文本,则该属性不会产生效果。
- text-indent属性的值可以是负值,这将导致第一行向左缩进而非向右缩进。
- 在一些情况下,文本缩进可能会被其他CSS属性覆盖,例如text-align,因此需要注意优先级。
结论
text-indent属性是CSS中控制文本缩进的属性,适用于块级元素或块级容器中的第一行文本。通过设置文本缩进,可以使文本排版更加美观、规范。在使用时,需要注意text-indent属性的取值范围、百分比的计算方式、优先级等,以避免出现不必要的问题。