如何将li垂直居中于div

来源：百度知道 编辑：UC知道 时间：2024/06/14 17:11:38
就是如下代码

<div style ="width:700; height:500; line-height :500;border: 1px solid #ddd;" >
<ul>
<li style="float:right;"><img src ="images/icon_arrow01.gif" alt ="" /> <a href="#" class="link01">返回首页</a>  </li>
<li style="float:right;"><img src ="images/icon_arrow01.gif" alt ="" /> <a href="#" class="link01">在线咨询</a>  </li>
<li style="float:right;"><img src ="images/icon_arrow01.gif" alt ="" /> <a href="#" class="link01">返回首页</a>   </li>
<li style="float:right;"><img src ="images/icon_arrow01.gif" alt ="" /> <a href="#&qu

没法按你说的垂直居中，只能用padding人工定位让它居中。现实的情况是，你的height:500px不会经常修改的。

<div style ="width:700; height:500; line-height :500;border: 1px solid #ddd;vertical-align:middle;display:table-cell" >
<ul style="margin-top:expression(250-this.heigth/2)">
<li style="float:right;"><img src ="images/icon_arrow01.gif" alt ="" /> <a href="#" class="link01">返回首页</a> </li>
<li style="float:right;"><img src ="images/icon_arrow01.gif" alt ="" /> <a href="#" class="link01">在线咨询</a> </li>
<li style="float:right;"><img src ="images/icon_arrow01.gif" alt ="" /> <a href="#" class="link01">返回首页</a> </li>
<li style="float:right;"><img src ="images/icon_arrow01.gif" alt ="" /