6x转换为css？

Question

只想问我怎么能转换我的6x;到css

我有以下代码：

<ul data-role="listview" data-inset="true" data-theme="d" data-divider-theme="e" data-count-theme="a">
        <li>
            <img src="/css/images/yahoo-mail.png" alt="yahoo-mail" class="ui-li-icon"/>
            <a href="./about">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Yahoo!</a><span class="ui-li-count">3</span>
        </li>
</ul>

Answer 1

删除所有 并使用填充：

a{padding-left:20px}

Answer 2

这样做：

<ul data-role="listview" data-inset="true" data-theme="d" data-divider-theme="e" data-count-theme="a">
        <li>
            <img src="/css/images/yahoo-mail.png" alt="yahoo-mail" class="ui-li-icon"/>
            <a href="./about"><span class="link-text">Yahoo!</span></a><span class="ui-li-count">3</span>
        </li>
</ul>

CSS：

.link-text:before {
    content: '      '; /* 6 spaces */
}

Answer 3

在标记中提供span标记。

<a href="./about"><span></span>Yahoo!</a>

然后给填充跨越。

Answer 4

有很多方法可以做到这一点。我可能会为图标图像添加一个边距：

.ul-li-icon {
  margin-right: 20px
}