为什么我的背景图像在悬停上移动？ :(

My problem is here
嗨，可有人告诉我，问题出在哪里？我的背景图像只是移动悬停后带班的李.cerny 这里是我的代码。为什么我的背景图像在悬停上移动？ :(

aside nav ul { 
      list-style-type:none; 
      margin:0; 
      padding:0; 
      margin-top:25px; 
     } 


    li.cerny { 
     height:50px; 
     background: url("images/cerny.png") no-repeat top left; 
     margin-left:-24.2px; 
     margin-bottom:5px; 
       } 
     .cerny:hover { 
     color:black; 
     background: url("images/menu_hover.png") no-repeat top left; 
     } 

    .cerny a{ 
     text-decoration:none; 
     color:wheat; 
     display:block; 
     padding-top:18px; 
     padding-left:40px; 
     font-size:15px; 
<aside> 
    <nav> 
      <ul> 
    <li class="cerny"><a href="#" style="margin-top:20px;">Můj statek</a></li> 
    <li class="cerny"><a href="#">Tržiště</a></li> 
    <li class="cerny"><a href="#">Město</a></li> 
    <li class="cerny"><a href="#">Soutěžní centrum</a></li> 
    <li class="cerny"><a href="#">Okolí</a></li> 
      </ul> 
    </nav> 
</aside>

来源

2015-02-24 Forlorn

图片'cerny.png'和'menu_hover.png'尺寸是否相同？尺寸。 – danhardman 2015-02-24 14:28:31

这取决于你的背景图片。您提供你的'cerny.png'和'menu_hover.png'文件，以便我可以检查是否是这种情况？ – NikitaBaksalyar 2015-02-24 14:28:34

最有可能你的图像没有正确对齐。即带有红色框和10px填充图像（在图像中）的图像全部用于默认状态，然后用蓝色框用于悬停状态。然而，蓝框有10px（顶部），5px（右），10px（底部）和15px（左）填充。如果像这样的事情发生在你的图像中，那么你会看到一个转变，因为每个图像中的左填充/间距是不同的。 – hungerstar 2015-02-24 14:31:50

五月是你的图片（cerny.png和menu_hover.png）大小是不一样的。在Photoshop中检查。

来源

2015-02-24 14:32:53

为什么我的背景图像在悬停上移动？ :(

回答

相关问题