html - 背景图片分隔符不会显示在我的 CSS 菜单中

标签 html css image list menu

我在我的 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/

相关文章:

javascript - 如何在没有 Ajax 的情况下将拖放图像提交给 servlet?

javascript - 如何改变整个网站的颜色和背景

html - 表格单元格不符合我要强制执行的高度

java - 将字节转换为图像

html - 在单独的页面上显示帖子信息的困难

html - bootstrap 3 折叠导航栏 - 展开时下拉标题超出屏幕

apache - @font-face 字体只适用于它们自己的域

javascript - iframe 中不解析 Css 和 Javascript

html - 在自动宽度 div 中调整背景大小

html - 缩放图像以适合边界框