文字垂直居中常用技巧

1.当行文字垂直居中

设置高度和行高相等

例如：

<ul>
<li><a href="#" title="nav1" target="_self">nav1</a><li>
<li><a href="#" title="nav2" target="_self">nav2</a></li>
<li><a href="#" title="nav3" target="_self">nav3</a></li>
</ul>

设置a的行高和高度相等即可。

2.多行文字垂直居中

<div style="padding:10px 0;">此处显示新 Div 标签的内容</div>

设置填充上下相等即可。

3.input文字垂直居中

<style type="text/css">
.bg {
background:url(images/search_bg.gif) no-repeat;
font-size:12px;
padding:8px 0;
border:none;
line-height:29px;
color:#ccc;
_height:29px;
_padding:0;
}
</style>

<input name="search" type="text" class="bg" value="请输入您的关键字" size="100" />

设置行高等于上下填充和文字大小之和即可，为了兼容ie6给ie6单独定义高度，去除填充值。