好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

flex布局基本语法的详细介绍

本篇文章给大家带来的内容是关于flex布局基本语法的详细介绍,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

  如果所有项目的flex-shrink属性都为1,当空间不足时,都将等比例缩小。如果一个项目的flex-shrink属性为0,其他项目都为1,则空间不足时,前者不缩小.负值对该属性无效

flex-basis : 定义了在分配多余空间之前,项目占据的 主轴 空间(main size),浏览器根据这个属性,计算主轴是否有多余空间。它的默认值为auto,即项目的本来大小

  它可以设为跟width或height属性一样的值(比如350px),则项目将占据固定空间

flex : 结合flex-grow, flex-shrink 和 flex-basis的属性, 默认值为0 1 auto, 推荐优先使用

  该属性有两个快捷值:auto (1 1 auto) 和 none (0 0 auto

align-self : 允许单个项目有与其他项目不一样的对齐方式,可覆盖align-items属性, 默认值为auto,表示继承父元素的align-items属性,如果没有父元素,则等同于stretch

  该属性可能取6个值,除了auto,其他都与align-items属性完全一致

【相关推荐:CSS视频教程】

以上就是flex布局基本语法的详细介绍的详细内容,更多请关注Gxlcms其它相关文章!

查看更多关于flex布局基本语法的详细介绍的详细内容...

  阅读:48次