文字在div中水平和垂直居中的的css样式
文字在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样式的更多相关文章
- 使文字在div中水平和垂直居中的的css样式为,四个边分别设置阴影样式
text-align:center; /*水平居中*/ line-height: 20px; /*行距设为与div高度一致*/ HTML元素 <div>水平垂直居中</div> ...
- 未知行数的文字在div中垂直居中
今天工作中遇到一个问题,就是未知行数的文字在div中怎么垂直居中,如下面的3个图: 图1 图2 图3 图1是2行文字的效果,图2是不经过css垂直居中处理的效果,图3是经过css垂直居中后的效果,ht ...
- div的水平和垂直居中
CSS实现div的水平居中 div的水平居中可以通过margin设置为0 auto实现. .myDiv { width: 200px; height: 100px; margin: 0 auto; } ...
- DIV元素水平和垂直居中
在前端开发过程中,经常要对元素进行居中设置.一般有水平居中,和垂直居中.一般设置水平居中简单.基本是margin:0 auto,就可以了.但是垂直居中,我们有时会觉得使用vertical-align, ...
- [转]如何让div中的内容垂直居中
转自:http://blog.163.com/yan_1990/blog/static/197805107201211311515454/ 虽然Div布局已经基本上取代了表格布局,但表格布局和Div布 ...
- 如何让div中的内容垂直居中
虽然Div布局已经基本上取代了表格布局,但表格布局和Div布局仍然各有千秋,互有长处.比如表格布局中的垂直居中就是Div布局的一大弱项,不过好在千变万化的CSS可以灵活运用,可以制作出准垂直居中效果, ...
- 一个div在另一个div中水平垂直的方法
html <div id="main"> <div id="box"> 一个div在另一个div中垂直居中实现方法 </div&g ...
- div中的img垂直居中的方法,最简单! 偷学来的,,,不要说我抄袭啊(*^__^*)
让div中的img垂直居中,水平居中很简单,用text-align:center; 让div中img垂直居中的方法其实也很简单 重点是: display:table-cell; 让标签具有表格的属 ...
- css 如何使图片与文字在div中居中展示?
1.情景展示 如何将图片与文字在div中一起居中展示? HTML片段 <div style="background: #fff;padding-top: 5px;border:1p ...
随机推荐
- MyEclipse2014/2015 安装Activiti插件
一.废话 按照传统的教程而言,安装Activiti Designer 可以从 Help -> Install New Software Name:Activiti BPMN 2.0 design ...
- 修炼dp(1)
从最简单的开始: POJ:The Triangle #include <cstdio> #include <algorithm> #include <cstring> ...
- 并发数据(锁)ReaderWriterLockSlim
ReaderWriterLockSlim 类 ReaderWriterLockSlim 类支持三种锁定模式:Read,Write,UpgradeableRead.这三种模式对应的方法分别是 Enter ...
- git archive
git archive --format zip --output ../g.zip 3.4.2 git archive --format=tar \ --remote=ssh://remote_se ...
- 如何创建一个要素数据类 IField,IFieldEdit,IFields,IFieldsEditI,GeometryDef,IGeometryDefEdit接口
如何创建一个要素数据类 创建要素类用到了IFeatureWorkspace.CreateFeatureClass方法,在这个方法中有众多的参数,为了满足这些参数,我们要学习和了解下面的接口. IFie ...
- JavaScript运行原理解析
原文:1.http://blog.csdn.net/liaodehong/article/details/50488098 2.Stack的三种含义 (阮一峰) 3. http://lib.csdn. ...
- HTTPS连接前的几毫秒发生了什么?
原文:http://blog.jobbole.com/48369/ 提示:英文原文写于2009年,当时的Firefox和最新版的Firefox,界面也有很大改动.以下是正文. 花了数小时阅读了如潮的好 ...
- 初始化时查看combox的文本内容
string sql = string.Format("select field_name from pt_temp_field where pt_name = '{0}' and temp ...
- Lua打印Table的数据结构工具类
--这是quick中的工具,作用就是打印Lua中强大的table的结构, 当table的嵌套层级比较多的时候,这个工具非常方便,开发中必备的工具. --具体使用方法:local debug = req ...
- 让MySQL数据库支持Emoji表情
问题:Emoji 表情是按照4个字节存储的,所以传统 mysql utf-8编码只能最大存储3字节. 解决:修改MySQL(5.5.3以上版本) 编码为utf8mb4 即可存储Emoji表,同时设置 ...