Question

div下ul如何垂直居中

如图 显示的文字只水平居中了 是置顶的效果 怎么实现水平居中的情况下同时垂直居中

#muen_right_one_main
{
width:962px;
height:36px;
margin-top:6px;
text-align:center;
}
#muen_right_one_main ul
{
/* 消除 ul 上部产生的空白 */
padding:0px;
margin:0px;
overflow:hidden;
/* 清除列表样式 */
list-style:none;
margin:auto;
}
#muen_right_one_main ul li
{
display:inline;
padding:0px;

}

<div id="muen_right_one_main">
<ul id="nav">
<li><a href="#">首 页</a></li>
<li></li>
<li><a href="#">企业简介</a></li>
<li></li>
<li><a href="#">新闻中心</a></li>
<li></li>
<li><a href="#">产品中心</a></li>
<li></li>
<li><a href="#">人力资源</a></li>
<li></li>
<li><a href="#">联系我们</a></li>
</ul>
</div>

Answer 1

步骤如下：

1、先找到对应ul使用的样式类。如该ul使用名字叫“shou”的样式。

2、打开css文件，会发现只有shou li样式，直接作用在了li上，没有ul样式。

3、添加一段直接作用在ul上的样式。magin-top：6px代表ul离div最上面的距离已经设定死了。这是最直接的垂直高度设置的方式。magin代表ul边框和div之间的空隙。

4、如果文件中已存在对ul样式的定义。那就直接修改。看看是否有magin top这个属性。

5、注意ul中的li样式必须要有float：left or right这样的属性定义，不然排版不会整齐的排成一行。会成纵列。

6、如果想要div中的ul保持垂直方向上的居中，是对ul样式magin需要定义，而不是li。

Answer 2

1.既然你的div高度是固定的，那么直接设置ul的padding-top/margin-top不就可以了？
2.如果你的div高度是不固定的，那么你可以做个定位垂直居中，也可以利用inline-block+vertical-align:middle;来做垂直居中。
3.这里是导航，那么直接设置a的line-height为36px即可。

Answer 3

<li style=“line-height:36px;vertical-align:middle;”> 设置行高 和 整个div 一样高，再用垂直居中vertical-align:middle

Answer 4

使用line-height:等于你的li高度