CSS实现垂直居中的5种方法

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

使用 CSS 实现垂直居中并不容易。有些方法在一些浏览器中无效。下面我们看一下使对象垂直集中的5种不同方法,以及它们各自的优缺点。(可以看看测试页面,有简短解释。)

vertical-align: middle;

https://www.qianduan.net/css-to-achieve-the-vertical-center-of-the-five-kinds-of-methods/

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1.绝对定位居中技术 我们一直用margin:auto实现水平居中,而一直认为margin:auto不能实现垂直居...
    DecadeHeart阅读 1,631评论 0 3
  • 目录 一、使用Flexbox实现CSS竖向居中 一、理解vertical-align或“如何竖向居中” 1、Tab...
    7点的郝老师阅读 3,799评论 0 1
  • 垂直居中一直是CSS布局中比较令人头疼的问题,相比于水平居中,垂直居中对于不同的元素类型需要采取截然不同的策略,因...
    文风Yu阅读 55,661评论 2 8
  • 八分饱 八杯水 八睡时 吃饭八分饱 身强体力好 一日八杯水 补血肤不老 睡眠八小时 健身又补脑 亲爱的大咖 送你八...
    旖旎i阅读 185评论 0 5
  • 早晨洗脸的时候,突然就想明白了“维次”这个词的含义。 老师用“生命维次”这个词的时候,我理解为境界、层次。意义有些...
    紫贝海风阅读 2,307评论 7 16