flex的12个属性
容器（父元素）的属性：
flex-direction属性决定主轴的方向
flex-wrap 属性决定项目在一行排不下的情况下是否换行
flex-flow flex-flow属性是flex-direction属性和flex-wrap属性的简写形式，默认值为row nowrap。
jstify-content justify-content属性定义了项目在主轴上的对齐方式
align-items 属性定义了每行项目在側轴方向上的对齐方式\
align-content属性 align-content属性定义了容器在側轴方向上有额外空间时怎样排布
子容器
order属性 order属性定义项目的排列顺序。数值越小排列越靠前，默觉得0，可能的值为随意整数。
flex-grow属性 flex-grow属性定义项目的放大比例，默觉得0，即假设存在剩余空间也不放大。
flex-shrink属性 flex-shrink属性定义了项目的缩小比例，默觉得1。即假设空间不足该项目将缩小。
flex-basis 属性定义了在分配多余空间之前，项目占领的主轴空间（main-size）。
flex属性 flex属性是flex-grow, flex-shrink 和 flex-basis的简写，默认值为0 1 auto。
align-self属性 align-self属性同意单个项目有与其它项目不一样的側轴对齐方式，可覆盖align-items属性。
flex的12个属性的更多相关文章
- 关于flex，好像有12个属性非常重要
关于Flex,有12个属性非常重要 这几天在学习Flex布局,发现Flex真的好厉害! Flex是Flexible Box的缩写,意为"弹性布局",用来为盒模型提供最大的灵活性. ...
- Flex的 Event中属性currentTarget与target的区别
Flex的 Event中属性currentTarget与target的区别 1.区别 (1)currentTarget是事件的处理对象(event processor) (2)target是事件的调用 ...
- Flex的 Event中属性currentTarget与target的差别
Flex的 Event中属性currentTarget与target的差别 1.差别 (1)currentTarget是事件的处理对象(event processor) (2)target是事件的调用 ...
- flex三个对齐属性的记忆方式
今天在群里聊天有人说 flex的那几个居中属性好难记,时不时都要尝试一下,或者查看一下文档,现在我把我自己的记忆方式分享一下... 1. flex的居中主要是通过这三个属性来实现的: justify- ...
- Flex布局教程及属性速查
一.Flex布局介绍 伸缩盒模型(flexbox)是一个新的盒子模型,意为"弹性布局",用来为盒状模型提供最大的灵活性,主要优化了UI布局.Flexbox的功能主要包手:简单使用一 ...
- CSS3动画属性和flex弹性布局各个属性
[CSS3动画的使用] 1.声明一个关键帧(动画): @keynames name{ from{} to{} } 每个阶段的写法: ①可以直接使用from-to的写法 ②可以设置0%-100%的写法, ...
- 12.vue属性.监听.组件
1.计算属性 https://cn.vuejs.org/v2/guide/computed.html new Vue({ computed:{//定义 show(){ } } }) ++计算属性1.h ...
- Flex布局-项目的属性
Flex项目有以下6个属性: order flex-grow flex-shrink flex-basis flex align-self order属性定义项目的排列顺序.数值越小,排列越靠前,默认 ...
- Flex布局-容器的属性
本文部分内容参考阮一峰大神博客,原文地址:http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html Flex布局即弹性布局,使用起来十分方便灵活 ...
随机推荐
- Linux下去掉^M方法
由于windows和Linux文件格式不同,windows下文件在Linux下行尾会有^M 去掉^M方法 sed -i ‘s/^M//g' filename #注意:^M的输入方式是 Ctrl + v ...
- 阶段3 1.Mybatis_03.自定义Mybatis框架_1.自定义Mybatis的分析-执行查询所有分析
- MAVEN打包时跳过Junit测试
我们知道,通常情况下使用maven package命令打包时,会自动执行test包下的各个单元测试. 这是因为spring-boot-maven-plugin插件已经集成了maven-surefire ...
- Gradle原理动画讲解（五）
Gradle原理动画讲解
- Ubuntu新建用户以及安装pytorch
环境:Ubuntu18,Python3.6 首先登录服务器 ssh username@xx.xx.xx.xxx #登录一个已有的username 新建用户 sudo adduser username ...
- Git 的使用及其一些基本用法
打开你的git-bash 绑定用户和邮箱作为标识 $ git config --global user.name "your name" $ git config --global ...
- Linux常用命令基础
linux 常用指令 基础命令 宿主目录 目录结构 文件管理 目录管理 用户管理 别名管理 压缩包管理 网络设置 shell技巧 帮助方法 /表示根目录 ~表示家目录 软件的安装(光盘中的软件呢): ...
- C++中的数组操作符重载
1,本文讲述数组操作符重载,上篇博文的字符串类 string 确实强大,但 string 类 对象还具备 C 方式字符串的灵活性吗?还能直接访问单个字符吗? 1,C 方式字符串灵活性是指能够通过数组 ...
- 洛谷 P1631 序列合并（优先队列）
传送门 解题思路 首先读入a.b数组后,sort一遍(从小到大),然后把a[1]+b[1],a[2]+b[1],a[3]+b[1]……a[n]+b[1]全部加入一个优先队列q(小根堆). 然后从一到n ...
- 最长上升子序列(LIS) Medium2
JGShining's kingdom consists of 2n(n is no more than 500,000) small cities which are located in two ...