通用

<div id="parent">
<div id="child">Content here</div>
</div>
#parent {display: table;}
#child {
display: table-cell;
vertical-align: middle;
}
/*低版本 IE fix bug*/
#child {
display: inline-block;
}

定位居中

<div id="parent">
<div id="child">Content here</div>
</div>
#parent {position: relative;}
#child {
position: absolute;
top:;
left:;
height:;
width:;
margin: auto;
}

css 元素垂直居中的更多相关文章

  1. css元素垂直居中

    一.碎碎念:啊啊啊,原谅我只能起一个酱紫微大众微俗气的标题,因为实在没有什么能比这样表达的更清楚直观了呢! 二.没有知识储备,直接上示例: 1.思路:给父元素添加display: table属性:给子 ...

  2. [转]-CSS 元素垂直居中的6种方法

    原文地址:http://blog.zhourunsheng.com/2012/03/css-%E5%85%83%E7%B4%A0%E5%9E%82%E7%9B%B4%E5%B1%85%E4%B8%AD ...

  3. CSS 元素垂直居中的 6种方法

    利用CSS进行元素的水平居中,比较简单,行级元素设置其父元素的text-align center,块级元素设置其本身的left 和 right margins为auto即可.本文收集了六种利用css进 ...

  4. CSS元素垂直居中方法总结

    坚持,坚持,坚持... 以上为自我鼓励,哈哈... ------------------------------------------------- 相信没有真正是尝试过的人应该都和我一样,觉得居中 ...

  5. css元素垂直居中的8中方法

    1. 通过vertical-align:middle实现CSS垂直居中 通过vertical-align:middle实现CSS垂直居中是最常使用的方法,但是有一点需要格外注意,vertical生效的 ...

  6. css元素垂直居中方法

    1.Line-height 适用情景:单行文字垂直居中技巧 这个方式应该是最多人知道的了,常见于单行文字的应用,像是按钮这一类对象,或者是下拉框.导航此类元素最常见到的方式了.此方式的原理是在于将单行 ...

  7. css点滴1—八种方式实现元素垂直居中

    这里介绍实现元素垂直居中的方式,文章是参考了<css制作水平垂直居中对齐>这一篇文章. 1.行高和高度实现 这种方式实现单行垂直居中是很简单的,但是要保证元素内容是单行的,并且其高度是不变 ...

  8. HTML/CSS:div居中和div内部元素垂直居中(1)

    div居中 div水平和垂直居中,text-align和vertical-align不起作用,因为标签div没有这两个属性,所以再css中设置这两个值不能居中的效果 1. div水平居中:设置marg ...

  9. CSS布局:元素垂直居中

    CSS布局之元素垂直居中 本文将依次介绍在不同条件下实现垂直居中的多种方法及简单原理 Tip:下文中说的适用场景只是举了几个简单的例子方便读者理解.实际应用场景太复杂,生搬硬套容易出错.最重要的是掌握 ...

随机推荐

  1. 088 Merge Sorted Array 合并两个有序数组

    给定两个有序整数数组 nums1 和 nums2,将 nums2 合并到 nums1中,使得 num1 成为一个有序数组.注意:你可以假设 nums1有足够的空间(空间大小大于或等于m + n)来保存 ...

  2. React Native开发时devices offline和手机不能晃动的处理

    1. adb device 显示 devices offline 可能重启adb server: $ adb kill-server $ adb start-server 2. 华为等手机不能 晃动显 ...

  3. 《高性能MySQL》读书笔记之 MySQL锁、事务、多版本并发控制的基础知识

    1.2 并发控制 1.2.1 读写锁 在处理并发读或写时,通过实现一个由两种类型的锁组成的锁系统来解决问题.这两种类型的锁通常被称为 共享锁(shared lock) 和 排它锁(exclusive ...

  4. SQL Server 2008添加字段成功,但提示列名无效

    在sql后查询,给现有表添加一个字段,即执行sql语句: alter table [sxrq_1108].[dbo].[公司周报表详情] add 总计 int default 0 然后在上述sql查语 ...

  5. dos命令-环境变量-数据类型-命名规范

    JAVA第一天笔记--dos命令-环境变量-数据类型-命名规范 1.能够阐述JDK和JRE之间区别 JDK(Java Development Kit)是提供给开发人员使用的JAVA开发工具包(java ...

  6. jmeter分布式测试配置

    jmeter分布式测试 说明:1台8核16G的windows2008的机器,只能器6000个线程,否则效果不是很好:并且负载机器需要做如下设置: 1.打开注册表:regedit 2.HKEY_LOCA ...

  7. navicate连接mysql

    1. 打开navicate,选择连接 2. 编辑连接属性 编辑完成之后,连接成功.

  8. 阿里云apt-get安装包时Err:2 http://mirrors.cloud.aliyuncs.com/ubuntu xenial-security/main amd64 git amd64 1:2.7.4-0ubuntu1.2 404 Not Found

    新部署的云服务器出现如下错误: root@iZj6cbjalvhsw0fhndmm5xZ:~# apt-get install git Reading package lists... Done Bu ...

  9. ulrlib案例-爬取百度贴吧

    1.任务需求 百度贴吧有很多主题,每个主题下的网页存在很多分页.爬取不同的主题,并下载每个主题下的多页网页. 输入贴吧名称,下载相应贴吧的多页网页,设置最多下载50页. 2.分析网页 访问不同的百度贴 ...

  10. 利用python进行数据分析2_数据采集与操作

    txt_filename = './files/python_baidu.txt' # 打开文件 file_obj = open(txt_filename, 'r', encoding='utf-8' ...