flex布局(Flexible布局, 弹性布局)
重要概念:
- 开启flex布局的元素叫做 flex container
- flex container 里面的直接子元素叫做 flex items
如何开启flex布局:?
设置display属性为flex或者inline-flex 可以成为flex container
- display: flex 块级元素, flex container 以block-level形式存在
- display: inline-flex 行内元素 , flex container 以inline-level形式存在
flex布局模型:
main axis 主轴
cross axis 交叉轴
flex相关属性
应用在flex container 上的CSS属性
- flex-flow
- flew-direction
- flex-wrap
- justify-items
- align-contaent
应用在flex items 上的CSS属性
- flex
- flex-grow
- flex-basis
- flex-shrink
- order
- align-self
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。