text-indent属性缩进无效解决方法

来源:互联网 发布:机器人算法和plc程序 编辑:程序博客网 时间:2021/06/19 14:10

用text-indent属性对文本内容进行缩进为什么会失效?


一般情况下:

text-indent属性只对块级元素内的文本内容起作用,在内联元素中使用text-indent属性时 需要加上display:block;这个属性,这样的话text-indent属性才能发挥正常作用。


特殊情况下:

有些特殊情况下,即使正常在块级元素中使用 text-indent属性,也在内联元素中加上了display:block;,也无法得到自己预期的效果。

原因何在?

在当前元素的父级或者“爷爷”级元素上,使用了text-align:xxx;从而干扰了text-indent属性的效果。

所以只要在要进行缩进的元素上加上text-align:left;就可以解决这个问题。