-1

アンカーを親リスト項目の正確なサイズに一致させるにはどうすればよいですか? 現在、要素自体のサイズが表示されます。

CSS:

ul li a{color: black;background:url(http://mwv3.webs.com/menu_hover.png)-20px bottom no-repeat;
padding:0px 0px 9px 0px;width:100%;
    -webkit-transition: background .5s ease;
     -moz-transition: background .5s ease;
       -o-transition: background .5s ease;
      -ms-transition: background .5s ease;
          transition: background .5s ease;
}

ul li a:hover{
 background:url(http://mwv3.webs.com/menu_hover.png) center bottom 
}

HTML

<div id="wrapper">
 <div class="nav">
   <ul>
     <li><a href="#">One</a></li>
     <li><a href="#">One</a></li>
     <li><a href="#">One</a></li>
     <li><a href="#">One</a></li>
     <li><a href="#">One</a></li>
   </ul>
 </div>
</div>

ありがとう

4

1 に答える 1

0

このcssを使用するだけで、jsfiddleで正常に動作します

ul li a{color: black;background:url(http://mwv3.webs.com/menu_hover.png)-20px bottom no-repeat;
    padding:0px 0px 9px 0px;width:100%;
        -webkit-transition: background .5s ease;
         -moz-transition: background .5s ease;
           -o-transition: background .5s ease;
          -ms-transition: background .5s ease;
              transition: background .5s ease;
    display:block;/*ADDED*/
}

ul li a:hover{

background:url(http://mwv3.webs.com/menu_hover.png) center bottom no-repeat; /*Changed*/
}
于 2013-09-09T10:35:49.320 に答える