CSS 属性“text-indent”不适用于 html span 元素
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18144991/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS property "text-indent" not working with html span element
提问by Bipin Kumar Pal
For example:-
例如：-
HTML Code
HTML代码
<div>
<h1><span class="title-icon">icon</span> Hello India!</h1>
</div>
CSS Code
CSS 代码
h1{
}
h1 span{
background: url("../images/icon.png")
text-indent: -9999px;
width:24px;
height:24px;
margin-right:1em;
}
回答by Spudley
text-indentdoesn't work on inlineelements. <span>defaults to being inline. You need to change it so it works as an inline block:
text-indent不适用于inline元素。<span>默认为inline. 您需要对其进行更改，使其作为内联块工作：
display:inline-block;
回答by Vladimir Bozic
Try setting font-sizeto zero:
尝试设置font-size为zero：
h1 span {
background: url("../images/icon.png")
font-size: 0;
width: 24px;
height: 24px;
margin-right: 1em;
}
回答by HasanG
My problem was with text-align. In case you modify align mode of the element or parent element(s) wrapping it to left, you must give a negative index for text-indent. Otherwise you must give a positive value.
我的问题是文本对齐。如果您修改元素的对齐模式或将其向左包装的父元素，则必须为 text-indent 提供负索引。否则，您必须给出一个正值。
.case1{text-indent:-999px;text-align:left;overflow:hidden;display:block}
Otherwise
除此以外
.case2{text-indent:999px;text-align:right;overflow:hidden;display:block}
