我已经摆弄这段代码一个半小时了，只是想弄清楚如何使元素居中。我的 div 似乎不影响 ul 或 li，我不知道如何将它居中。无论如何我都不是专业人士，这是我在网上找到的一些免费代码以及我 friend 给我的一段 javascript，它正是我想要的，这是一个水平下拉列表 [还有子菜单水平]。 请有人帮忙T.T
查看我现在得到的实时预览here
这是代码
<style>
body {
font: 80%/1.2 Arial, Helvetica, sans-serif; }
#navbar {
position: inherit;
top: 0;
margin: 0 auto;
padding: 0;}
#navbar li {
list-style: none;
float: left;}
#navbar li a {
display: inline;
padding: 3px 8px;
text-transform: uppercase;
text-decoration: none;
color: #999;
font-weight: bold;
text-align:center }
#navbar li a:hover {
color: #000; }
#navbar li ul {
display: none; }
#navbar li:hover ul, #navbar li.hover ul {
position: absolute;
display: inline;
left: 0;
width: 100%;
margin: 0;
padding: 0; }
#navbar li:hover li, #navbar li.hover li {
float: left; }
#navbar li:hover li a, #navbar li.hover li a {
color: #000; }
#navbar li li a:hover {
color: #357; }
</style>
<script>
sfHover = function() {
var sfEls = document.getElementById("navbar").getElementsByTagName("li");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" hover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" hover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
</script>
</head>
<body>
<ul id="navbar">
<li><a href="#">Exhibits and Events</a>
<ul>
<li><a href="#">Current Exhibit</a></li>
<li><a href="#">Coming Exhibit</a></li>
<li><a href="#">Events</a></li>
</ul>
</li>
<li><a href="#">About Us</a>
<ul>
<li><a href="#">About 1</a></li>
<li><a href="#">About Two</a></li>
<li><a href="#">Third About</a></li>
</ul>
</li>
<li><a href="#">Contact</a>
<ul>
<li><a href="#">Via Email</a></li>
<li><a href="#">Stalk Us Elsewhere</a></li>
</ul>
</li>
<li><a href="#">Press</a>
<ul>
<li><a href="#">Bench Press</a></li>
<li><a href="#">Military Press</a></li>
<li><a href="#">Press 'n Seal</a></li>
</ul>
</li>
</ul>
</body>
</html>
最佳答案
在您的 CSS 代码 #navbar 中，添加这两行:
text-align:center;
margin: 0 auto;
这应该可以解决问题。
关于javascript - 需要居中整个导航栏，包括子菜单，找不到正确的代码。我的 JavaScript 搞砸了吗？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/11642519/