多行文本居中

来源:网络 责任编辑:栏目编辑 发表时间:2013-07-01 11:16 点击:

对于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里面输入什么,或者输出什么,都是垂直居中的,因为它在表格里面了。

摘自:gaohui blog

    相关新闻>>

      发表评论
      请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
      用户名: 验证码:点击我更换图片
      最新评论 更多>>

      推荐热点

      • WordPress添加百度喜欢按钮小技巧
      • Wordpress 博客如何实现自定义Gravatar头像
      • 网站设计分析:建立良好的视觉层级
      • 网站设计分析:“中国式设计”的三个方向
      • 案例分析:奥巴马筹款网站的制作过程
      • 创建不平衡的平衡:在网页设计中使用不对称设计
      • 7大主流B2C首页导航栏设计对比分析
      • Wordpress页面模板制作方法及使用
      • css控制文字前的小图标
      网站首页 - 友情链接 - 网站地图 - TAG标签 - RSS订阅 - 内容搜索
      Copyright © 2008-2015 计算机技术学习交流网. 版权所有

      豫ICP备11007008号-1