文字在div中水平和垂直居中的的css样式

text-align:center; /*水平居中*/
line-height: 20px; /*行距设为与div高度一致*/
示例如下:
HTML元素
<div>水平垂直居中</div>
css样式
div{
width:200px;height:200px; /*设置div的大小*/
border:1px solid green; /*边框*/
text-align: center; /*文字水平居中对齐*/
line-height: 200px; /*设置文字行距等于div的高度*/
overflow:hidden;
}

文字在div中水平和垂直居中的的css样式的更多相关文章

  1. 使文字在div中水平和垂直居中的的css样式为,四个边分别设置阴影样式

    text-align:center; /*水平居中*/ line-height: 20px; /*行距设为与div高度一致*/ HTML元素 <div>水平垂直居中</div> ...

  2. 未知行数的文字在div中垂直居中

    今天工作中遇到一个问题,就是未知行数的文字在div中怎么垂直居中,如下面的3个图: 图1 图2 图3 图1是2行文字的效果,图2是不经过css垂直居中处理的效果,图3是经过css垂直居中后的效果,ht ...

  3. div的水平和垂直居中

    CSS实现div的水平居中 div的水平居中可以通过margin设置为0 auto实现. .myDiv { width: 200px; height: 100px; margin: 0 auto; } ...

  4. DIV元素水平和垂直居中

    在前端开发过程中,经常要对元素进行居中设置.一般有水平居中,和垂直居中.一般设置水平居中简单.基本是margin:0 auto,就可以了.但是垂直居中,我们有时会觉得使用vertical-align, ...

  5. [转]如何让div中的内容垂直居中

    转自:http://blog.163.com/yan_1990/blog/static/197805107201211311515454/ 虽然Div布局已经基本上取代了表格布局,但表格布局和Div布 ...

  6. 如何让div中的内容垂直居中

    虽然Div布局已经基本上取代了表格布局,但表格布局和Div布局仍然各有千秋,互有长处.比如表格布局中的垂直居中就是Div布局的一大弱项,不过好在千变万化的CSS可以灵活运用,可以制作出准垂直居中效果, ...

  7. 一个div在另一个div中水平垂直的方法

    html <div id="main"> <div id="box"> 一个div在另一个div中垂直居中实现方法 </div&g ...

  8. div中的img垂直居中的方法,最简单! 偷学来的,,,不要说我抄袭啊(*^__^*)

    让div中的img垂直居中,水平居中很简单,用text-align:center; 让div中img垂直居中的方法其实也很简单 重点是: display:table-cell;   让标签具有表格的属 ...

  9. css 如何使图片与文字在div中居中展示?

      1.情景展示 如何将图片与文字在div中一起居中展示? HTML片段 <div style="background: #fff;padding-top: 5px;border:1p ...

随机推荐

  1. 转:检查点(web_reg_find函数详解)

    LR检查点 设置检查点的目的不只是为了验证我们的脚本没有错误,而更重要的是一个规范问题,如何使得测试结果更具有说服力,因此建议所有的测试脚本中都添加检查点设置 一.设置检查点的方法 1.将脚本切换到树 ...

  2. how to enable #ifdef macro in the command line of make?

    Compilers normally use the -D flags eg Code: test.o: test.cpp $(CC) $(CFLAGS) -DTEST1 test.cpp -o $@

  3. gcd timer

    //0.创建队列 dispatch_queue_t queue = dispatch_get_global_queue(, ); NSLog(@"%s",__func__); // ...

  4. ScrollView的fillViewPort属性

    ScrollView嵌套Relative时候会发生问题,RelativeLayout不会充满ScrollView,即使设置match_parent属性也不行 这个时候就需要fillViewPort属性 ...

  5. VC#2010 视图设计器无法打开 问题的正解

    继上次VC#2010中视图设计器无法打开的问题的讨论后,我感觉每次都重新安装一次安装包未免也太麻烦了,程序员的时间都灰常宝贵. 所以在这次人工智能作业的时候,找到了一个简单的途径: 打开VC#2010 ...

  6. Ubuntu Apache2 配置简单介绍

    debian系列的(如Ubuntu,本人是Ubuntu 12.04的)Apache 通过 apt-get 方式安装的是 Apache2 的,是 httpd 的 2.x 版本,名字直接叫 apache2 ...

  7. (中等) HDU 5293 Tree chain problem,树链剖分+树形DP。

    Problem Description   Coco has a tree, whose vertices are conveniently labeled by 1,2,…,n.There are ...

  8. (中等) POJ 2828 Buy Tickets , 逆序+线段树。

    Description: Railway tickets were difficult to buy around the Lunar New Year in China, so we must ge ...

  9. MAP--复杂map结构的构造

    我的关键结构比如 struct{     int a;     int b;     int c; }s: 因为这三个数据是基本信息,可以唯一区别一个设备.拿这样一个数据结构作为索引就能找到每个设备. ...

  10. HTML--绝对路径, 表格,表单, 框架

    URL, URI, URN URL: 统一资源定位符: Uniform Resource Locator URN: 持久可用的资源标准名称 Uniform Resource Name , 比如邮箱 U ...