css Flex容器属性有哪些
2023-03-15 23:13:03 时间
1、flex-direction设置主轴的方向
即项目的排列方向。
flex-direction: row | row-reverse | column | column-reverse;
2、flex-wrap
默认情况下,item都排在一条线(又称”轴线”)上。flex-wrap属性定义了,如果一条轴线排不下,item的换行方式。
flex-wrap: nowrap | wrap | wrap-reverse;
3、flex-flow
flex-flow属性是flex-direction属性和flex-wrap属性的简写形式,默认值为row nowrap。
.box { flex-flow: <flex-direction> <flex-wrap>; }
4、justify-content
定义了项目在主轴上的对齐方式。
justify-content: flex-start | flex-end | center | space-between | space-around;
5、align-items
设置了项目在交叉轴上的对齐方式。
align-items: flex-start | flex-end | center | baseline | stretch
6、align-content
多根轴线的对齐方式。
align-content: flex-start | flex-end | center | space-between | space-around | stretch;
以上就是css Flex容器6种属性的介绍,希望对大家有所帮助。更多css学习指路:css教程
本文教程操作环境:windows7系统、css3版,DELL G3电脑。
相关文章
- 一篇运维老司机的大数据平台监控宝典(2)-联通大数据集群平台监控体系详解
- 一篇运维老司机的大数据平台监控宝典(1)-联通大数据集群平台监控体系进程详解
- 空中换引擎 博时基金数字化转型经验谈
- 如何高效地学习编程语言
- 作为一名阿里巴巴数据分析大牛,送给学弟学妹的经验积分
- 为什么要学习R语言
- Hadoop大数据分析平台的介绍性讨论
- 最全面的Spring学习笔记
- 16个用于数据科学和机器学习的顶级平台
- 给有抱负的数据科学家的六条建议
- 如何做一枚合格的数据产品经理
- 除Kaggle外,还有哪些顶级数据科学竞赛平台
- 一个鲜为人知却可以保护隐私的训练方法:联合学习
- 干货 :送你12个关于数据科学学习的关键提示(附链接)
- 大数据行业有多少种工作岗位,各自的技能需求是什么?
- 中国移动研究院常耀斌:商用大数据平台的研发之路
- 这些数据科学家必备的技能,你拥有哪些?
- 自学成才的开发者有何优势和劣势?
- Gartner报告:正处于数据科学与机器学习工具 “大爆炸”的时代
- Ready Computing借助InterSystems IRIS医疗版为医疗机构提供具有高度互操作性和可扩展性的解决方案