订阅
DIV+CSS之我见
chrome浏览器字体小于12px字体
多行文本居中
作者:admin 日期:2011-08-29
对于CSS,似乎并没有提供给我们一种简洁的不确定行数的文本的居中的方法.
如果我们只有一行文本,那我们可以,设置高度和行高相等这样来解决.
但是如果我们不知道有多少行,文本行数是个变量,并且我们需要不管是多少行,都要让文本在框中垂直居中,这样用css恐怕就有点难度了...
如果你用过表格布局,你肯定对它方便的垂直居中设置记忆犹新.
没错,就是用表格.在DIV中嵌套表格.没人规定DIV+CSS布局的时候不能用表格啊。
<style type="text/css">
.test {
height: 300px;
width: 300px;
}
</style>
<div class='test'>居中</div>
那我们就可以
<div class="test"><table width="100%" height="100%" border="0" cellspacing="0"><tr><td>此处显示 class "test" 的内容</td></tr></table></div>
此时，不管td里面输入什么，或者输出什么，都是垂直居中的，因为它在表格里面了。
如果我们只有一行文本,那我们可以,设置高度和行高相等这样来解决.
但是如果我们不知道有多少行,文本行数是个变量,并且我们需要不管是多少行,都要让文本在框中垂直居中,这样用css恐怕就有点难度了...
如果你用过表格布局,你肯定对它方便的垂直居中设置记忆犹新.
没错,就是用表格.在DIV中嵌套表格.没人规定DIV+CSS布局的时候不能用表格啊。
<style type="text/css">
.test {
height: 300px;
width: 300px;
}
</style>
<div class='test'>居中</div>
那我们就可以
<div class="test"><table width="100%" height="100%" border="0" cellspacing="0"><tr><td>此处显示 class "test" 的内容</td></tr></table></div>
此时，不管td里面输入什么，或者输出什么，都是垂直居中的，因为它在表格里面了。
文章来自: 
Tags: 评论: 10 | 查看次数: 6542
