首页 > 代码库 > CSS3伸缩布局Flex学习笔记
CSS3伸缩布局Flex学习笔记
如果需要使用伸缩布局首先得把display:flex;对于兼容还得加前缀display:-webkit-display:flex;等其他浏览器前缀,但我本机Chrome测试已经不需要加前缀了,其实这些还好,关键移动端竟然不支持这个属性,移动端支持的还是老版本的display:-webki-box;不过对于学习来说,也不管它支持不支持了,学了再说吧,更何况Chrome已经把flex的前缀去了,说明flex多少还是有些稳定的。
下面列出了关于CSS与flex一起使用的一些属性
display 显示方式
flex-direction 设置flex模型的方向
justify-content 设置水平方向的对齐
align-items 设置垂直方向的对齐
flex-wrap 是否换行
align-content 设置换行后的对齐方式
flex-flow 简写flex-direction和flex-wrap
order 指定顺序
align-self 覆盖容器的对齐项目属性
flex 指定长度
CSS3伸缩布局Flex学习笔记