0

現在、ロゴとしてイメージスプライトを使用しているため、ロゴにカーソルを合わせると赤に変わります。HTMLの場合、次のように設定します。

<div id="logo-wrap">
  <a id="logo" href="<?php bloginfo('url'); ?>"></a>
</div>
         ​

#000「logo-wrap」divを追加して背景色を設定することを目指しましたが、何も変わりません。ただし、背景に追加background: #000 url(imageurl);するとが表示されます。A#logo

ロゴ自体に色を追加しても、黒い背景にパディングを追加することはできません。それは「スプライト」のアイデア全体を台無しにします。

ロゴの背景を別にして、約10pxのパディングを追加する方法を見つけようとしています。

これは可能ですか？または、これを実現するためにHTMLとCSSを変更する必要がありますか？

フィドル//

http://jsfiddle.net/dFmQK/

4

1 に答える 1

1

あなたの質問から、これがあなたが目指していることだと思います。

これをCSSに使用します

    #logo-wrap { background: #123; width:176px; height:61px; padding: 10px;}
    A#logo {     width:176px; height:61px; background: url(http://keihead.com/test/images/trd_sprite.png) 0 0 no-repeat; position:relative; float: left;}
    A#logo:hover { background-position: 0 -61px;   }

http://jsfiddle.net/dFmQK/1/

于 2012-11-07T23:47:31.187 に答える