• 技术文章 >Web开发 >css教程

    css中flex-shrink属性是什么

    小妮浅浅小妮浅浅2021-10-23 10:13:28原创12079

    1、flex-shrink指的是当flex容器空间不足时候,单个元素的收缩比例。

    2、不支持负值,默认值是1,也就是默认所有的flex子项都会收缩。如果设置为0,则表示不收缩,保持原始的宽度。

    实例

    1

    2

    3

    4

    5

    6

    7

    8

    9

    10

    11

    12

    13

    14

    15

    16

    17

    18

    19

    20

    21

    22

    23

    24

    // CSS部分

    .content{

        display: flex;

        width: 400px;

        height: 200px;

        border: 1px solid;

    }

      

    .left, .center, .right{

        height: 200px;

    }

      

    .left{

        width: 100px;

        background-color: aqua;

    }

    .center{

        width: 200px;

        background-color: bisque;

    }

    .right{

        width: 300px;

        background-color: cadetblue;

    }

    以上就是css中flex-shrink属性的介绍,希望对大家有所帮助。更多css学习指路:css教程

    本文教程操作环境:windows7系统、css3版,DELL G3电脑。

    专题推荐:css flex-shrink
    上一篇:css中flex-grow属性是什么 下一篇:css中flex-basis属性是什么

    相关文章推荐

    • css背景中有哪些方法• css有哪些字体文本样式• css中盒模型的注意点• css中counter-reset属性是什么• css中counter-increment属性是什么• css中counter()函数的介绍• css中couters函数是什么• css中align-content属性是什么• css中align-items属性是什么• css中justify-content属性是什么• css中flex-flow属性是什么• css中flex-wrap属性是什么• css中flex-direction属性是什么• css中order属性的介绍• css中flex-grow属性是什么

    全部评论我要评论

    © 2021 Python学习网 苏ICP备2021003149号-1

  • 取消发布评论
  • 

    Python学习网