HTML
<div>
<ul class="menubar">
<li>home</li>
<li>product</li>
<li>about us</li>
<li>contact us</li>
</div>
CSS
.menubar li
{
float: left;
position: relative;
display: block;
text-decoration: underline;
text-transform:capitalize
background:url(../image/rightborder.png) no-repeat right center;
}
.menubar li:hover
{
background: #FF0000 ;
color: #FFFFFF;
}
这项工作工作正常,但问题是 background:url(../image/rightborder.png)
出现在最后一个菜单“联系我们”之后。无论如何要关闭它。
最佳答案
添加 class
属性到最后一项,比如 <li class=last>contact us</li>
, 并添加规则 .menubar li.last { background-image: none; }
.
这适用于所有支持 CSS 的浏览器。虽然有点笨拙,但使用类选择器是最安全的,当涉及单个列表时,笨拙因素是无关紧要的。
关于html - 删除最后一列的背景图片,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10510225/