0
我有一个简单的HTML/CSS列表,内嵌显示。我使用列表的背景图像和该列表的onhover命令的另一个变体。CSS背景图像放置在:悬停
关于悬停的背景图像似乎并不正确。它显示有点太大,似乎有一些默认的填充,
什么是最好的方式来控制CSS的onhover命令的背景图像的大小,填充和边距?
在此先感谢
#navbar{
background-image: url('../images/navbar.png');
color: white;
font: 20px arial,sans-serif;
height: 45px;
}
#navbar a{
color: white;
text-decoration: none;
}
#navbar ul{
list-style: none;
margin:0;
padding:0;
}
#navbar li{
border-right: solid 1px white;
display: inline-block;
height: 45px;
line-height: 45px;
padding: 1px 10px 1px 10px;
}
#navbar li:hover{
background-image: url('../images/navbar-selected.png');
}
<div class="clear" id="navbar">
<ul>
<li><a href="index.php">Home</a></li>
<li><a href="stock.php">Stock</a></li>
<li><a href="overview.php">Overview</a></li>
</ul>
</div>
请上传一个工作示例jsfiddle.net或类似的,它有点难以帮助没有看到这个问题: ) – 2011-12-15 13:47:01
你知道navbar.png是#navbar的背景吗?不应该是#navbar li的背景吗? – ptriek 2011-12-15 13:51:31