1,设置其line-height值，使之与其高度相同

2,设置table结构，用vertical-align:middle;

3,应用定位,父级别：position：relative；子级：position:absolute; top:50%;margin-top:-自身高度的一半；

4,display:flex;一种弹性布局，兼容性不太好

5,css3的translate属性

css实现垂直居中的方法的更多相关文章

  1. 转: css实现垂直居中的方法

    利用 CSS 来实现对象的垂直居中有许多不同的方法,比较难的是选择那个正确的方法.我下面说明一下我看到的好的方法和怎么来创建一个好的居中网站. 用 CSS 实现垂直居中并不容易.有些方法在一些浏览器中 ...

  2. CSS中垂直居中的方法

    昨天总结了css中水平居中的方法,今天来总结一下css中实现垂直居中的方法. line-height line-height用于实现单行文本的垂直居中,如下图中,我们要求单行文本垂直居中,只需要将di ...

  3. CSS水平垂直居中的方法

    原文链接:http://caibaojian.com/370.html 水平垂直居中,特别是使用在列表的时候经常会用到的,以前有需求的时候我也做过类似的代码,是使用display:table-cell ...

  4. 介绍一种css水平垂直居中的方法（非常好用！）

    这次介绍一下一个水平垂直居中的css方法,这个方法可以说是百试百灵,废话不多说,直接附上代码: html,body{ width:100%; height:100%; } 你需要居中的元素{ posi ...

  5. css水平垂直居中的方法与 vertical-align 的用法

    前言:这是笔者学习之后自己的理解与整理.如果有错误或者疑问的地方,请大家指正,我会持续更新! 1. 已知元素宽度 方法一:已知宽高,可以用position定位 + margin负值的方法 : 绝对定位 ...

  6. css实现垂直居中的方法整理

    1.表格布局法.(利用表格的显示模式)需要用到一些冗余的 HTML 元素,因此这里不多介绍. 2.行内块法.也不作讨论,因为在我看来这种方法 hack 的味道很浓. 如果你有兴趣,可以去看看 Chri ...

  7. css 水平垂直居中的方法总结

    在项目中经常会遇到设置元素水平垂直居中的需求.而且具体的场景也不同,所以将个人总结的方法做个汇总,希望对浏览者有用. 以下所举的例子都以一个html为准,这里规定好一些公用样式. body { bac ...

  8. CSS水平垂直居中常见方法总结

    1.元素水平居中 当然最好使的是: margin: 0 auto; 居中不好使的原因: 1.元素没有设置宽度,没有宽度怎么居中嘛! 2.设置了宽度依然不好使,你设置的是行内元素吧,行内元素和块元素的区 ...

  9. CSS水平垂直居中常见方法总结2

    1.文本水平居中line-height,text-align:center(文字)元素水平居中 margin:0 auo 方案1:position 元素已知宽度 父元素设置为:position: re ...

  10. [css]水平垂直居中的方法

    1.top:cale(50% - 2rem); left:cale(50% - 2rem);

随机推荐

  1. reinstall_xbt: Linux中如何查看文件的最初创建时间

    Linux中如何查看文件的最初创建时间 与文件相关的几个时间: 1.访问时间,读一次这个文件的内容,这个时间就会更新.比如对这个文件使用more命令.ls.stat命令都不会修改文件的访问时间.   ...

  2. 安卓开发笔记——自定义HorizontalScrollView控件（实现QQ5.0侧滑效果）

    对于滑动菜单栏SlidingMenu,大家应该都不陌生,在市场上的一些APP应用里经常可以见到,比如人人网,FaceBook等. 前段时间QQ5.0版本出来后也采用了这种设计风格:(下面是效果图) 之 ...

  3. Apache Tomcat关于shtml和SSI技术

    Tomcat http://blog.csdn.net/leftfist/article/details/8520773 http://webdevelop.jzxue.com/shtml/ http ...

  4. STM32 程序所占用空间计算 && FLASH存储的起始地址计算

    程序编译完成,会乘车program size .. 对STM32容量选型或者 计算FLASH 充当EEPROM起始地址时会用到此参数. 按照下面截图  程序空间 = (16700+732+4580)/ ...

  5. c# File 操作

    //1.---------文件夹创建.移动.删除--------- //创建文件夹 Directory.CreateDirectory(Server.MapPath("a")); ...

  6. AC_Dream 1211 Reactor Cooling

    /* 题意:无源无汇,并且每条边的容量有上下界限的网络流问题!既然无源无汇,那么素有的节点都应该满足“入流==出流”! 输出每一条边的流量,使得满足上面的条件.(如果u->v有流量,那么v-&g ...

  7. #敏捷个人资料# 免费下载 《敏捷个人－认识自我，管理自我 v0.8.pdf》

    快乐.高效.平衡,做一个爱学习.有目标.懂生活的影响者. 从今天开始至7月31日,点击http://t.cn/Rv3koHU 免费收到 1000多页的 <敏捷个人-认识自我,管理自我 v0.8. ...

  8. 性能调优：理解Set Statistics Time输出

    在性能调优:理解Set Statistics IO输出我们讨论了Set Statistics IO,还有如何帮助我们进行性能调优.这篇文章会讨论下Set Statistics Time,它会告诉我们执 ...

  9. IOS高级编程之二：IOS的数据存储与IO

    一.应用程序沙盒 IOS应用程序职能在系统为该应用所分配的文件区域下读写文件,这个文件区域就是应用程序沙盒.所有的非代码文件如:图片.声音.映象等等都存放在此. 在mac中command+shift+ ...

  10. Linux文件打包压缩、解压缩、备份命令使用方法（转载）

    对于刚刚接触Linux的人来说,一定会给Linux下一大堆各式各样的文件名给搞晕.别个不说,单单就压缩文件为例,我们知道在Windows下最常见的压缩文件就只有两种,一是,zip,另一个是.rar.可 ...