ccs記述に、#xxx li {

質問

ccs記述に、#xxx li {
list-style: url(../images/xxx.gif) inside;
}と、liにボタン画像を入れ、このliが3つ並ぶようにHTMLで記述してあります。そのうちの1つのボタンだけを、別の画像にしたいとき、どのように指定すれば効果的でしょうか？
ありがとうございます！

回答No.3

ORUKA1951

IE6など古いタイプのブラウザでは無効の場合がありますが、CSS2だと隣接(兄弟)セレクタが使えます。
div.menue ol li{
　　list-style: url(../images/xxx.gif) disc inside;
}
div.menue ol li+li{
　　list-style-image:url(../images/yyy.gif);
}
div.menue ol li+li+li{
　　list-style-image: url(../images/xxx.gif);
}

HTML・・・・
<div class="menue">
　<ol>
　　<li></li>
　　<li></li>
　　<li></li>
　</ol>
</div>

お礼

みなさんすごすぎ！
わたしもそのレベルに早く到達したいです！
ありがとうございました。
やってみます！

回答No.2

tomoticks

構造擬似クラスで指定されたらどうでしょう？

#xxx li:nth-child(番号)

例えば二番目だけ変えたいなら

list-style:nth-child(2){
url(../images/zzz.gif) inside;
}

みたいな

お礼

なるほど！
ありがとうございます！
やってみま～す。

回答No.1

zeff

id（またはclass）で指定するだけでOKです。
#xxx li {
list-style: url(../images/xxx.gif) inside;
}
#xxx li#yyy{
list-style: url(../images/yyy.gif) inside;
}

<ul id="xxx">
<li>通常のリスト</li>
<li>通常のリスト</li>
<li id="yyy">違うイメージを使う</li>
<li>通常のリスト</li>
</ul>

お礼

ありがとうございます！
やってみま～す。