<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. ajax请求处理和views处理函数的优先级

    当采用ajax处理请求的时候,在views函数中使用 return render(request,'XXX.html',{'error':form.get_error()}) 返回渲染模板时,会优先处 ...

  2. python爬虫(四)_urllib2库的基本使用

    本篇我们将开始学习如何进行网页抓取,更多内容请参考:python学习指南 urllib2库的基本使用 所谓网页抓取,就是把URL地址中指定的网络资源从网络流中读取出来,保存到本地.在Python中有很 ...

  3. 2014/08/23——OJ及相关站点打开速度非常慢,训练计划login直接error!

    问题: 这个问题存在已经将近一个星期了.刚開始时发现OJ及相关的站点有时候打开有点慢,那时候也没在意,后来时快时慢的越来越频繁:今天早上直接一直都打开非常慢(无论什么时候.这样的情况);训练计划和做题 ...

  4. Orchard Core Framework:ASP.NET Core 模块化,多租户框架

    Orchard Core Framework:ASP.NET Core 模块化,多租户框架 上一篇编写Orchard Core一分钟搭建ASP.NET Core CMS ,介绍ASP.NET Core ...

  5. 关于React组件之间如何优雅地传值的探讨

    闲话不多说,开篇撸代码,你可以会看到类似如下的结构: import React, { Component } from 'react'; // 父组件 class Parent extends Com ...

  6. 【SqlServer系列】AS的用法

    1   概述 本篇文章简要分析,在SQL SERVER中,AS的基本用法. 2   具体分析 2.1  定义变量类型 )='Alan_beijing' 2.2 取别名 2.2.1 为结果集列取别名 c ...

  7. ABP入门系列(12)——如何升级Abp并调试源码

    ABP入门系列目录--学习Abp框架之实操演练 源码路径:Github-LearningMpaAbp 1. 升级Abp 本系列教程是基于Abp V1.0版本,现在Abp版本已经升级至V1.4.2(截至 ...

  8. 项目实战12.2—企业级监控工具应用实战-zabbix操作进阶

    无监控,不运维.好了,废话不多说,下面都是干货. 流量党勿入,图片太多!!! 项目实战系列,总架构图 http://www.cnblogs.com/along21/p/8000812.html 一.U ...

  9. mybatis分页练手

    最近碰到个需求,要做个透明的mybatis分页功能,描述如下:目标:搜索列表的Controller action要和原先保持一样,并且返回的json需要有分页信息,如: @ResponseBody @ ...

  10. mybatis 整合spring之mapperLocations配置的问题

    今天尝试spring整合mybatis时遇到这么一个问题,就是在配置sqlSessionFactory时是否要配置mapperLocations的问题. <bean id="sessi ...