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. iOS开发-Xcode升级后插件失效解决办法

    打开terminal,输入如下命令: | xargs -I{} defaults write {} DVTPlugInCompatibilityUUIDs -array-add `defaults r ...

  2. ubuntu 搭建 samba 服务器

    . sudo apt-get install samba samba-common . sudo vi /etc/samba/smb.conf [alair's share] path = /home ...

  3. Sql触发器模板

    触发器是一种特殊类型的存储过程,它不同于之前的我们介绍的存储过程. 触发器主要是通过事件进行触发被自动调用执行的.而存储过程可以通过存储过程的名称被调用. SQL Server 2005中触发器可以分 ...

  4. iOS-布局-Masonry-优先级

    一.AutoLayout有两个重要的属性: 1.Content Compression Resistance 百度翻译(内容压缩抗力) 2.Content Hugging    百度翻译(内容拥抱) ...

  5. MySQL安全问题（防范必知）

    对于任何一种数据库来说,安全问题都是非常重要的.如果数据库出现安全漏洞,轻则数据被窃取,重则数据被破坏,这些后果对于一些重要的数据库都是非常严重的.下面来从操作系统和数据库两个层对MySQL的安全问题 ...

  6. dock基本使用

    通过Docker源安装最新版本通过Docker源安装最新版本 要安装最新的 Docker 版本,首先需要安装 apt-transport-https 支持,之后通过添加源来安装.要安装最新的 Dock ...

  7. 看看如何面试前端工程师：Github很重要

    从程序员的角度提出要去学习哪些知识,下面这篇文章从面试官的角度介绍到面试时可能会问到的一些问题.不过我想先给你们一个忠告,招聘是一件非常艰巨的任务,在45分钟内指出一名侯选人是否合适是你需要完成的任务 ...

  8. 点餐系统web版功能需求

                餐厅到店点餐系统需求分析 (版本v1.0.0)               成文信息 主题词: 需求分析 作  者: 14商软ETC 文档类别: 审  核: 批  准: 文档性 ...

  9. Winform开发的界面处理优化

    在Winform开发中,客户体验是个很好的参考性指标,如果一个功能使用的时候感觉很流畅,说明我们的程序执行效率还不错,但是随着数据的真多,原先可能流程的地方可能会变得比较卡,这时候就需要追本索源,找到 ...

  10. 关于PS激活的一些感想（附上PS CC2015）

    最近跟着慕课学了一些前端的必备PS技能,就顺道把PS CC2015装上. 安装的过程没什么大问题,最要命的是激活环节!各种踩坑,但万万没想到,最终我还是成功的把它激活了. 本人所安装PS版本信息 好了 ...