0

ulliアイテムの端のすぐ外に配置したい背景画像があります。

画像

ULLIアイテムの矢印

私がやろうとしていることがわかると思います。その小さな右向きの矢印を、下向きの上部にあるものと同様に、egdeから離して配置します。(ライムは矢印と同じ色に変更されますが、moでは矢印が実際に見えるように対照的な色を付けました)

CSS

body ul#main_navigation li li:hover > a, body ul#main_navigation li li.over > a
{
     background-image:url(/images/nav_arrow_right.png);
     background-repeat:no-repeat;
     background-position:center right;
     background-color: #0F0;
     color: #FFF;
}

望ましい結果

ここに画像の説明を入力してください

編集:私は矢印を正しく配置することができましたが、それは途切れています...アイテムの外側にあるものを切り落とさないようにするにはどうすればよいですか?

4

1 に答える 1

1

@Francescaポジショニングで遊ぶことができるので、background-positionそこに行く矢印画像をどこに配置するかを設定できます............

私はあなたにいくつかの大まかな考えを与えています私はあなたの多くのコードを持っていません...

body ul#main_navigation li li:hover > a, body ul#main_navigation li li.over > a
{
     background-image:url(/images/nav_arrow_right.png);
     background-repeat:no-repeat;
     background-position:center 10px;
     background-color: #0F0;
     color: #FFF;
}
于 2012-08-20T11:09:42.280 に答える