我试图在我的博客上获取下拉菜单,但它没有结果。我相信主题中存在下拉菜单,因为我可以在 CSS 中看到一些证据。这是我第一次来这里,所以我会尽量具体
<div id='nav1-wrapper'>
<div id='nav1'>
<ul class='sf-menu sf-js-enabled'>
<li class='cat-item'><a expr:href='data:blog.homepageUrl' title='Home'>Home</a></li>
<ul>
<li>
<a href=''><span>About Us</span></a>
</li>
</ul>
<li class='cat-item'><a expr:href='data:blog.homepageUrl + "feeds/posts/default"' title='Posts RSS'>Posts RSS</a></li>
<li class='cat-item'><a expr:href='data:blog.homepageUrl + "feeds/comments/default"' title='Comments RSS'>Comments RSS</a></li>
<li class='cat-item'><a href='#' title='Edit this link'>Edit</a></li>
</ul>
</div>
</div>
在测试模式下,我试图在主页下获得“关于”,但它不起作用,而是变成了一个新的主菜单。
这是CSS
#nav1-wrapper {
}
#nav1 {
font-size: 13px;
height: 37px;
width:978px;
margin-left:auto;
margin-right:auto;
background: url(http://4.bp.blogspot.com/_WoCJXgXotb8/SukuVz4pzoI/AAAAAAAABVM/IjgR927kxe8/s1600/nav1-sep.png) no-repeat left top;
}
#nav1 ul.sf-menu li {
position: relative;
background: url(http://4.bp.blogspot.com/_WoCJXgXotb8/SukuVz4pzoI/AAAAAAAABVM/IjgR927kxe8/s1600/nav1-sep.png) no-repeat right top;
float: left;
line-height: 36px;
padding: 0 1px 0 0;
text-align: center;
}
#nav1 ul.sf-menu li a {
color: #666666;
display: block;
position: relative;
float: left;
font-weight:bold;
padding:0 13px 0 13px;
cursor: pointer;
letter-spacing:-0.01em;
font-size:14px;
}
#nav1 ul.sf-menu li a:hover {
text-decoration: none;
line-height: 36px;
color: #333333;
}
#nav1 ul.sf-menu li a:active{
color: #000000;
text-decoration: none;
line-height: 36px;
}
#nav1 ul.sf-menu li ul.children {
border: 1px solid #000000;
background: #272726 url(http://1.bp.blogspot.com/_WoCJXgXotb8/Suk0OoE_6LI/AAAAAAAABV8/40qI1cTpwfU/s1600/ul_children_bg.gif) repeat-y top right;
}
#nav1 ul.sf-menu li ul.children li {
background: url(http://3.bp.blogspot.com/_WoCJXgXotb8/Suk0vKvLK4I/AAAAAAAABWE/18lJ8uP1Aes/s1600/ul_children_li_bg.gif) no-repeat bottom right;
}
#nav1 ul.sf-menu li ul.children li a {
color: #bebebe;
text-decoration: none;
display:block;
}
#nav1 ul.sf-menu li ul.children li a:hover {
text-decoration: none;
background: none;
}
#nav1 ul.sf-menu li ul.children li ul.children {
border: 1px solid #000000;
border-left: none;
background: #272726 url(http://3.bp.blogspot.com/_WoCJXgXotb8/Suk3Qj6Zi4I/AAAAAAAABWM/vwv6kTkSeG4/s1600/ul_children_ul_children_bg.gif) repeat-y top left;
}
#nav1 ul.sf-menu li ul.children li ul.children li {
background: url(http://3.bp.blogspot.com/_WoCJXgXotb8/Suk0vKvLK4I/AAAAAAAABWE/18lJ8uP1Aes/s1600/ul_children_li_bg.gif) no-repeat bottom right;
}
#nav1 ul.sf-menu li ul.children li ul.children a {
color: #bebebe;
text-decoration: none;
}
#nav1 ul.sf-menu li ul.children
{
margin:5px 0 0 0;
}
#nav1 ul.sf-menu li ul.children ul.children
{
margin:-1px 0 0 27px;
}
我编辑了这个问题,以便提供完整的 html 和 css 代码。谢谢网址:http ://thebusywire.blogspot.com/