美文网首页
五、flex

五、flex

作者: yuzhan550 | 来源:发表于2019-12-10 09:00 被阅读0次

    -webkit-box
    -webkit-flex / flex
    主轴 侧轴

    1. Old version:

    布局方向:
    -webkit-box-orient: horizontal/vertical
    排列方向:
    -webkit-box-direction: normal/reverse
    富裕空间的管理:
    webkit-box-pack
    start end center justify
    侧轴:
    webkit-box-align
    start end center

    2. New version:

    布局&排列方向:flex-direction
    row row-reverse column column-reverse
    富裕空间的管理:
    justify-content
    flex-start flex-end space-between space-around
    侧轴:
    align-items:
    flex-start
    flex-end
    center
    baseline (用得少)
    stretch(等高布局,项目没有高度)
    多行多列:
    align-content:flex-start
    单行单列:
    align-items:flex-start

    新版

    相关文章

      网友评论

          本文标题:五、flex

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