<BODY>
  <div class="box">
   <h3>1.单行文字居中</h3>
   <!--设置行高来实现-->
   <div class="box1">
    这是高度为30像素的单行文字
   </div>
 
   <h3>2.多行文字不定高度居中</h3>
   <!--运用padding来实现-->
   <div class="box2">
    <div>多行文字不定高度居中</div>
    <div>多行文字不定高度居中</div>
    <div>多行文字不定高度居中</div>
   </div>
 
  </div>
 </BODY>

=============================

.box {
 width: 800px;
 margin: 50px auto;
 border: 1px solid red;
 font-size: 16px;
 text-align: center;
}
.box1 {
 border: 1px dashed red;
 line-height: 40px;
 margin: 30px;
}
.box2 {
 border: 1px dashed red;
 padding: 60px 0;
 margin: 30px;
}
 
 
参考： http://www.cnblogs.com/siqi/archive/2013/06/16/3138289.html

多行文字水平垂直居中在div的更多相关文章

  1. table-cell实现未知宽高图片，文本水平垂直居中在div

    <BODY> <h1>未知宽高的图片水平垂直居中在div</h1> <!--box-outer--> <div class="box-o ...

  2. Android进阶(二十二)设置TextView文字水平垂直居中

    设置TextView文字水平垂直居中 有2种方法可以设置TextView文字居中: 一:在xml文件设置:android:gravity="center" 二:在程序中设置:m_T ...

  3. 多行文字的垂直居中或高度不同的图片垂直居中---:after伪类+content

    如何让多行文字垂直居中?或者如何让图片垂直居中? 1.demo--css .box { width: 300px; height: 300px; background-color: #f5e79e; ...

  4. 生成一个水平+垂直居中的div

    这是前端布局经常用到的布局方式,水平垂直居中:面试也经常会问到. 一. 绝对定位实现居中 注意:使用绝对定位布局的时候,外层元素必须也设置有position属性,具体设置为什么值看具体情况.只要不是s ...

  5. 微信小程序文字水平垂直居中对齐问题

    我们知道常用的居中对齐方式有很多种例如: text-align:center; align-items:center; justify-content: center; margin: auto; # ...

  6. DIV文字水平垂直居中的方法

    水平居中 text-align:center 垂直居中(vertical-align) vertical-align:middle; vertical-align时而没效果 然而真实使用的时候,我们会 ...

  7. css 单行图片文字水平垂直居中汇总

    (1) 水平居中 a. 行内元素水平居中 因为img是行内元素(行内块级元素也一样)父级元素设置text-align:center即可,例如: <div style="width: 6 ...

  8. CSS 实现：文字水平垂直居中

    ☊ [实现要求]: <div class="demo1"> 标题1111 </div> √ [实现]: 方案一:普通布局 .demo1 { text-ali ...

  9. 纯CSS实现图片水平垂直居中于DIV（图片未知宽高）

    <div class="demo"><a href="#"><img src="http://nec.netease.c ...

随机推荐

  1. tensorflow MNIST新手教程

    官方教程代码如下: import gzip import os import tempfile import numpy from six.moves import urllib from six.m ...

  2. springboot定时任务——整合Quartz

    http://blog.csdn.net/liuchuanhong1/article/details/60873295 http://blog.csdn.net/lyg_come_on/article ...

  3. plsql本机不安装数据库连接远程数据库

    用PL/SQL连接oracle数据库,不管是本地的还是远程的,一般都需要安装oracle客户端   如何达到不安装oracle客户端,又能使用PL/SQL工具?     1. oracle官网提供了i ...

  4. Python之Metaclass详解，Python之元类

    本人Java程序员一枚,这几天闲来无事就自学了下Python,学到Metaclass感觉有点迷惑,就在网上查相关资料,在栈溢出(stackoverflow)网站上看到一个关于metaclass的回答, ...

  5. springboot+CXF开发webservice对外提供接口(转)

    文章来源:http://www.leftso.com/blog/144.html 1.项目要对外提供接口,用webservcie的方式实现 2.添加的jar包 maven: <dependenc ...

  6. linux系统下安装单台Redis

    注意:搭建redis前一定要安装gcc redis安装方式一 1.安装gcc命令:yum install -y gcc #安装gcc [root@localhost src]# yum install ...

  7. NPOI：创建Workbook和Sheet

    NPOI官方网站:http://npoi.codeplex.com/ 创建Workbook说白了就是创建一个Excel文件,当然在NPOI中更准确的表示是在内存中创建一个Workbook对象流.在看了 ...

  8. 【JMeter】获取json响应报文中数组长度

    import com.jayway.jsonpath.JsonPath; import com.jayway.jsonpath.Predicate; import net.minidev.json.J ...

  9. layui动态设置下拉框数据，根据后台数据设置选中

    追加下拉框数据: 设置默认选中: 正常的判断这种情况是不行的,因为追加出的数据,在前台显示的并不是同一个下拉框,原来的下拉框被隐藏了 因此需要:根据原来的位置,寻找下一个节点,寻找子节点的方式找到相应 ...

  10. ansible服务及剧本编写

    第1章 ansible软件概念说明 python语言是运维人员必会的语言,而ansible是一个基于Python开发的自动化运维工具 (saltstack).其功能实现基于SSH远程连接服务:ansi ...