0

私はかなり複雑な問題を抱えています。いくつかのLIが内部にあるULがあります。

LI要素の前にある種のアイコンを挿入する必要があります。

アイコンは2つの部分である必要があります。1つはシンプルなフォームのPNG画像で、もう1つは動的な背景色の外形です。

具体的には、内部にシンプルなアイコンが付いた丸い円である必要があります。円の背景は、コードで変更できる必要があります。

私が今それを解決した方法は、LI要素内でSPANを使用し、次のように設定することです。

height: 20px;
width: 20px;
background: url(icon.png) 2px 2px no-repeat red;
border-radius: 20px

問題は、すべてのLI内にSPANを配置する必要があることですが、それはオプションではありません。どういうわけかこれを解決する必要があるので、内部にLIだけが含まれる「クリーンな」ULがあります。

これは私が今持っているものです:

<ul>
<li><span></span>Some text</li>
</ul>

LIとテキスト以外の要素は内部に存在できないため、次のように表示する必要があります。

<ul>
<li>Some text</li>
</ul>

どんな助けでも大歓迎です!前もって感謝します!

4

2 に答える 2

0

私はcssスプライトを使用します。 http://jsfiddle.net/mCGXv/

于 2012-08-13T18:52:48.130 に答える
0

CSS スプライトを使用します。

の左側にアイコンを追加するときは、必ずのliを増やしてください。問題ありません。役立つリソースを添付します。padding-leftli

http://www.electrictoolbox.com/add-icon-before-after-link-css/

于 2012-08-13T19:01:07.910 に答える