1

通常の html リスト アイテム ドットをjQuery UI アイコン シートの画像に置き換えたいと思います。

CSS:

li { padding: 0 0 0 5px; }

HTML

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

画像クラスを追加してもテキストが表示されません。ここで何を見逃したのですか？

http://jsfiddle.net/KKhZg/509/

4

3 に答える 3

3

クラスを追加すると、定義されli.ui-iconている幅が取得されます。ui-icon16px

あなたのフィドルを更新しました。

于 2013-07-01T11:06:23.320 に答える
2

言われているように、ネストされた要素を の中に挿入することができますli。

それをしたくない場合は、次の 2 つのルールを に追加してくださいli。

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

http://jsfiddle.net/KKhZg/512/

16pxすべてのjquery uiアイコンの幅なので、アイコンの後にテキストをインデントしたいと思います。

!importantjsfiddle では、ユーザー css の後に jqueryUI がロードされているように見えるため、入れました。そうしないと、 text-indentandoverflowによってオーバーライドされます.ui-icon

于 2013-07-01T11:19:07.817 に答える
1

これは、そのクラス名のテキスト インデントによるものです。ネストされた要素 (おそらくスパン) を挿入し、代わりにその要素にアイコン クラスを適用する必要がある場合があります。

于 2013-07-01T11:06:43.817 に答える