中心导航栏元素

Question

<div id="wrapper" class="hfeed">
<div id="access">
  <div id="menu">
    <ul>
      <li class="page_item page-item-2"><a title="About" href="/?page_id=2">About</a></li>

      <li class="page_item page-item-20"><a title="Support" href="/?page_id=20">Support</a></li>

      <li class="page_item page-item-22"><a title="Links" href="/?page_id=22">Links</a></li>

      <li class="page_item page-item-47"><a title="About" href="/?page_id=47">About</a></li>
    </ul>
  </div>
</div><!-- #access -->
</div>

我当前的 CSS：

div#menu {
background:#000;
height:1.5em;
margin:1em 0;
}

div#menu ul,div#menu ul ul {
line-height:1;
list-style:none;
margin:0;
padding:0;
}

div#menu ul a {
display:block;
margin-right:1em;
padding:0.2em 0.5em;
text-decoration:none;
}

div#menu ul ul ul a {
font-style:italic;
}

div#menu ul li ul {
left:-999em;
position:absolute;
}

div#menu ul li:hover ul {
left:auto;
}

是我的菜单，但我不知道如何将其置于页面中间。

Answer 1

就像hitautodestruct所说的有两种方法，但是你需要描述你想要什么。

您希望整个导航块中心对齐吗？
如果是这样，您可以在 css 中执行此操作（将宽度更改为您需要的宽度）：

div#menu {
    width:500px;
    margin: 0px auto;
}

您希望导航中的内容居中吗？
如果是这样，请将其添加到您的 css 中：

ul {
    text-align:center;
}

如果这些不是您要查找的内容，请您详细描述一下！干杯

Answer 2

尝试使用这个css属性：text-align和vertical-align
http://www.w3schools.com/css/pr_pos_vertical-align.asp
http://www.w3schools.com/CSS/pr_text_text-align.asp
我不确定你的 html 是不是入口页面，所以我不能为你编辑 css，如果可能的话，试着自己做。

Answer 3

如果你想在 x 网格上居中，你可以使用简单的自动边距技术：

1. 设置正文，使文本居中对齐：
   body{text-align:center;}

2. 将容器设置为具有左右自动边距，并使其所有文本都向左对齐：
   #wrapper{margin:0 auto;text-align:left;}

在垂直方面，按照这篇文章有点棘手：
http://phrogz.net/css/vertical-align/index.html