CSS属性＆＃34; text-indent＆＃34;不使用html span元素

Question

例如： -

HTML代码

<div>
     <h1><span class="title-icon">icon</span> Hello India!</h1>
</div>

CSS代码

h1{
}

h1 span{
    background: url("../images/icon.png")
    text-indent: -9999px;
    width:24px;
    height:24px;
    margin-right:1em;
}

Answer 1

text-indent不适用于inline个元素。 <span>默认为inline。您需要更改它以使其作为内联块：

display:inline-block;

Answer 2

尝试将font-size设为zero：

h1 span {
    background: url("../images/icon.png")
    font-size: 0;
    width: 24px;
    height: 24px;
    margin-right: 1em;
}

Answer 3

我的问题是text-align。如果您修改元素的父对齐模式或将其包装到左侧的父元素，则必须为text-indent指定负索引。否则你必须给出正值。

#sl_play:target

否则

.case1{text-indent:-999px;text-align:left;overflow:hidden;display:block}