美文网首页
4.2.1.1水平居中

4.2.1.1水平居中

作者: cooore | 来源:发表于2016-02-21 22:47 被阅读0次

inline-block (宽度为内容宽度)+ text-align

优点:兼容性非常好

缺点:child容器会继承父容器的text-align:center,child容器中的文字也会水平居中显示。

table + margin


优点:只需要设置child

缺点:只兼容IE8以上

absolute + transform

优点:绝对定位的元素脱离分档流不会对其他元素造成影响

缺点:IE9以上才支持

flex + justify-content

优点:只需设置父容器即可

缺点:IE9以上

相关文章

  • 4.2.1.1水平居中

    inline-block (宽度为内容宽度)+ text-align 优点:兼容性非常好 缺点:child容器会继...

  • css居中方式总结(亲测有效)

    水平居中(行内元素水平居中、块级元素水平居中) 垂直居中 水平垂直居中 行内元素水平居中 text-align: ...

  • 常用的居中方法

    本文将介绍的居中方法有 ,水平居中,垂直居中和水平垂直居中。 一水平居中 二水平垂直居中

  • CSS居中布局方案

    水平居中 垂直居中 水平垂直居中

  • CSS水平垂直居中总结

    CSS水平居中、垂直居中、水平垂直居中方法总结 文字的水平居中: 单行文字的垂直居中: 让有宽度的div水平居中:...

  • CSS相关

    居中 块元素水平居中 行内元素水平居中 模拟表格 实现水平居中display:table ( ) | table-...

  • 元素居中的方式

    1 水平居中 2 垂直居中 3 水平垂直居中

  • css实现元素居中

    水平居中 行内水平居中 行内水平居中就直接用text-align: center 块级水平居中 直接用margin...

  • 居中布局

    水平居中 垂直居中 垂直水平居中 已知元素的宽高的居中布局 定位居中布局 盒模型居中布局 图片的垂直水平居中(利用...

  • 所有CSS居中方法,了解一下?

    目录 水平居中内联元素水平居中块级元素水平居中多个块级元素的水平居中 垂直居中内联元素垂直居中单行内联元素多行内联...

网友评论

      本文标题:4.2.1.1水平居中

      本文链接:https://www.haomeiwen.com/subject/bxfbkttx.html