我在我的 css 菜单中使用了图像分隔符,但是联系按钮末尾的最后一个分隔符不会显示..
<div id="menu">
<ul>
<li><a href="index.html"><span class="used">Home</span></a></li>
<li><a href="services.html">Services</a></li>
<li><a href="contect.html">Contact</a></li>
<img src="img/divider.png" alt="" style="margin-left: auto; margin-right: auto;"/>
</ul>
</div>
那是我的菜单(忽略 divider.png,因为它是菜单下方的图像), 这是我的 CSS。
.header #menu {
word-spacing: 60px;
font: 17px 'Source Sans Pro', sans-serif;
font-weight: 400;
color: #333;
margin: 40px auto 0 auto;
width: 1024px;
overflow: hidden;
}
ul {
list-style: none;
display: block;
text-align: center;
}
li {
list-style: none;
width: 239px;
height: 69px;
display: inline-block;
vertical-align: baseline;
overflow: hidden;
background: url(../img/nav-divider.png) no-repeat 0 100%;
}
正如你所见,我的背景图片是我的分隔线,它适用于联系人列表元素之后的所有其他列表元素,它不会出现任何人的帮助,这让我抓狂。
非常感谢。
最佳答案
你可以像这样使用图片路径:
背景图片: 背景图片:url('images/image.png');
这应该有所帮助。
关于html - 背景图片分隔符不会显示在我的 CSS 菜单中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18633673/