html 文字垂直居中
发布网友
发布时间：2022-04-23 22:34
共4个回答
热心网友
时间：2022-04-20 02:10
单行文字（即文字较少，不够一行）重直居中比较好解决，使用行高和高度相等即可。如：.abc{height:100px;line-height:100px;}
多行文本垂直居中分两种情况
1、div高度不固定，使用padding属性，将上下空相等的间距即可，如：.abc{height:auto;padding:20px 10px;/*上下各空20px,左右空10px*/}
2、div固定高度文字重直居中（这种情况比较常见，稍微复杂些），思路，将div转化表格属性，因为表格是可以实现垂直居中的。需要多添加一个div层,具体如下：
样式代码：
.waiceng{
height:400px;
display:table;
}
.liceng{
vertical-align:middle;
display:table-cell;
border:1px solid #FF0099;
background-color:#FFCCFF;
width:760px;
}
源代码：
<div class="waiceng">
<div class="liceng">现在我们要使这段文字垂直居中显示</div>
</div>
声明：上面的代码IE6不支持。不过现在没几个人用IE6了，可以忽略了
热心网友
时间：2022-04-20 03:28
在css的样式中加入，text-align: center;这样文件就是决定居中了！
垂直居中
<style type="text/css">
<!--
.con_div{
width:400px;
height:300px;
border:1px solid #777;
text-align:center;
display:table-cell;
vertical-align:middle;
background:red;
color:#fff
}
/*FOR IE*/
.fixie{
width:0;
height:100%;
display:inline-block;
vertical-align:middle;
}
-->
</style>
<div class="con_div">
<span class="fixie"></span>
测试内容
</div>
http://blog.csdn.net/lifuxiangcaohui/article/details/6165034
热心网友
时间：2022-04-20 05:03
可以在 TD 标签中 加入 valign="middle" 属性。 比如 <td valign="middle">dsfdsfsdf</td>
当然，也可以用另一种方法，浏览器兼容性更好。 设置 TD 高度（同样适合DIV或者SPAN等任何标签） 然后为标签添加 line-height 属性 ，比如
<div style="height:30px; line-height:30px;">高度三十</div>
<td style="height:30px; line-height:30px;">高度三十</td>
<span style="height:30px; line-height:30px;">高度三十</span>
。。。。。。。。。。。。。。
热心网友
时间：2022-04-20 06:54
<tr>
<td><img src="../../images/vertline.gif" width="16" height="22" /></td>
<td><img src="../../images/node.gif" width="16" height="22" /></td>
<td width="124" height="22"><span style="width: 20px; height: 15px; float: left"><img src="../../images/doc2.gif" width="16" height="22" valign="middle"/></span><span style="width:85px;height:15px;float:left;font-size:12px;padding-top:2px"><a href="cUserCfg.html" target="basefrm"> 用户管理</a></span></td>
</tr>
