我似乎无法从导航中删除第一个导航菜单分隔符（small-black-heart-md.png）。除了第一张外，所有的图片都显示在正确的位置。它出现在第一个列表项"我们的故事"之前。我尝试过使用伪元素nav-li：first-child:before{display:none；}，但没有得到任何结果。我们非常感谢您的帮助。这个问题让我很困惑，我似乎在网上找不到明确的答案。谢谢你帮了个小忙！：）
这是我的CSS：
.banner {
background-image: url("images/navimages/topimage.jpg");
padding: 108px 200px;
}
* {
padding:0;
margin:0;
}
body {
width: 1000px;
margin-left: auto;
margin-right: auto;
background-color: #C4EDFF;
font-family: 'Tangerine', serif;
text-align: center;
}
p {
font-family: Arial;
font-size: 14px;
text-shadow: 1px 1px 1px #aaa;
text-align: left;
}
nav li {
text-shadow: 5px 5px 5px #aaa;
background-image: url(images/navimages/small-black-heart-md.png);
background-repeat: no-repeat;
padding-left: 40;
padding-right: 40;
font-size: 40px;
font-weight: bold;
display: inline;
}
li a {
color: gray;
text-decoration: none;
}
audio {
width: 640px;
}
a:hover {
color: black;
}
这是我的HTML:
<head>
<head>
<title>The Big Day</title>
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Tangerine">
<body>
<header class="banner"></header>
<nav>
<ul>
<li><a href="ourstory.html">Our Story</a></li>
<li><a href="photos.html">Photos</a></li>
<li><a href="details.html">Details</a></li>
<li><a href= "wishlist.html">Wish List</a></li>
<li><a href= "index.html">Home</a></li>
</ul>
</nav>
<BR><BR><BR>
<div style="
padding: 60px;
margin-left: auto;
margin-right: auto;
height: 400px;
width: 620px;
border: 10px double;
text-align: left;
box-shadow: 10px 10px 5px #888888;">
<p>Content here...</p></div>
</body>
</head>
</html>
只需使用：
nav li:first-child{
background:none;
}