zoukankan      html  css  js  c++  java
  • flex-grow,flex-shrink,flex-basis及flex

    flex-grow:默认值0;分配剩余空间的扩张比例;

    flex-basis:默认值auto;倘若设置了此属性,那么计算剩余空间之前要优先减去此属性,且它的层级比width高,会将width覆盖。

    有一点需要注意,如果flex-basis和width其中有一个是auto,那么另外一个非auto的属性优先级会更高。(也就是非auto的会覆盖auto的)。

    flex-shrink:默认值1;分配多余的空间压缩比例。

    设为0则代表无论如何都不压缩此子盒子。

    flex:flex-grow flex-shrink flex-basis;默认计算值为 0 1 auto
    当flex取值为none,则计算值为 0 0 auto
    当flex取值为auto,则计算值为 1 1 auto
    当flex取值为一个非负数字,则该数字为flex-grow的值,计算值为 非负数字 1 0%
    当flex取值为一个长度或百分比,则该值为flex-basis的值,计算值为 1 1 该长度或百分比
    当flex取值为两个非负数字,则分别视为flex-grow flex-shrink的值,计算值为 两个非负数字 0%
    当flex取值为一个非负数字和一个长度或百分比,则分别视为flex-grow flex-basis的值,计算值为 非负数字 1 长度或百分比

  • 相关阅读:
    部署prerender服务器
    Bzoj4727--Poi2017Turysta
    Bzoj4818--Sdoi2017序列计数
    Heoi2014系列题解
    scoi2017酱油记
    Burnside引理与Pólya定理
    2017省选前北京集训总结
    奥妙重重的随机发生器
    ???--???Insection is not allowed
    反演
  • 原文地址:https://www.cnblogs.com/xinyouhunran/p/10135699.html
Copyright © 2011-2022 走看看