flex布局在父容器和子容器上都有设置的属性
父容器上的属性
display: flex;
flex-direction:row; /*怎么排列 row column*/
flex-wrap: wrap; /*子容器是否换行 wrap是换行 nowrap是不换行 换行的话子容器宽高生效*/
justify-content: center; /*主轴子容器的对齐方式 默认是左对齐 flex-start flex-end是右对齐 居中是center space-around*/
align-items: flex-end; /*交叉轴轴子容器的对齐方式 默认是上对齐 flex-start flex-end是下对齐 居中是center*/
align-content: flex-start; /*多条轴线的对齐方式 就是不止一行时候的对齐方式 当子容器超过一行需要设置*/
子容器上的属性
flex:1 1 33.3333%; //第一个参数是放大倍数 第二个参数是缩小倍数 第三个是默认宽度
认识flex布局 flex布局（Flexible 布局，弹性布局）开启了flex布局的元素叫flex contai...
flex布局在父容器和子容器上都有设置的属性 父容器上的属性 子容器上的属性
FLEX布局 一种新的布局方式，flex布局 flex布局与方向无关 flex布局可以实现空间自动分配、自动对齐。...
一、Flex 布局教程：语法篇 Flex 布局教程：语法篇 二、Flex 布局教程：实例篇 Flex...
css flex布局详解 css flex布局详解1css flex布局详解2
阮一峰-Flex布局 阮一峰-Flex布局实例教程 Flex布局 块级元素 行内元素 注意，设为 Flex 布局...
经典教程 Flex 布局教程：语法篇Flex 布局教程：实例篇flex布局游戏 理解 flex布局实现需要至少两层...
Flex，(Flexible Box），意为"弹性布局"采用 Flex 布局的元素，为 Flex 容器（flex ...
css flex布局 采用 Flex 布局的元素，称为 Flex 容器（flex container），简称“容器...
一、介绍Flex布局 什么是Flex布局呢？Flex布局：又称弹性布局，它是Flexible Box 的缩写，它为...
本文标题：flex布局备忘录
本文链接：https://www.haomeiwen.com/subject/lvgwuftx.html
网友评论