jquery - 使用 jQuery UI 图标作为
背景

Question

我想用jQuery UI 图标表中的图像替换常规的 html 列表项点：

CSS：

li { padding: 0 0 0 5px; }

HTML

<ul>
    <li class="ui-icon ui-icon-play">abc</li>
    <li>abc</li>
</ul>

添加图像类时，我看不到我的文本。我在这里错过了什么？

score 3 · Accepted Answer

当您向其添加类时，li.ui-icon它将获得ui-icon定义的宽度16px。

我更新了你的小提琴。

score 2 · Accepted Answer

就像说的那样，您可以在li.

如果您不想这样做，只需将这两个规则添加到li：

li {
    text-indent: 16px !important;
    overflow: visible !important;
}

16px是所有 jquery ui 图标的宽度，所以我猜你希望你的文本在图标之后缩进。

我之所以放!important，是因为在 jsfiddle 上，jqueryUI 是在用户 css 之后加载的，否则text-indentandoverflow会被.ui-icon

score 1 · Accepted Answer

这将是由于该类名称上的文本缩进。您可能需要插入一个嵌套元素（可能是一个跨度），然后在该元素上应用图标类。

jquery - 使用 jQuery UI 图标作为背景