flex知识点精炼
- 原址:http://www.runoob.com/w3cnote/flex-grammar.html
容器的属性
- 设置Flex布局之后,子元素的float、clear、vertical align将失效。
- 任何一个容器都可以指定为flex布局。行内元素也可以使用flex布局,webkit内核的浏览器,必须加上-webkit前缀。
- flex-wrap属性默认的是不换行。
- flex-flow属性是flex-direction属性和flex-wrap属性的简写形式,默认是row nowrap。
- align-items属性的默认值是stretch:如果项目未设置高度或者为auto,将占满整个容器的高度。(aligin-content的默认属性也是stretch)
- align-content属性定义了多跟轴线的对其方式。如果项目只有一根轴线,该属性不起作用。
项目的属性
- order属性定义项目的排列顺序。数值越小排列越靠前默认为0。
- flex-grow的属性默认为0,flex-shrink的属性默认为1。它们两个都不能为负。
- flex-shrink的值越大,减小的越厉害。如果值为0,表示不减小
- flex属性:flex属性是flex-grow、flex-shrink、flex-basis的简写,默认值为0 1 auto。后两个属性可选。该属性有两个快捷键——auto(1 1 auto)none(0 0 auto)。建议优先使用这个属性,而不是单独写三个分离的属性,因为浏览器会推算相关值。
flex知识点精炼的更多相关文章
- flex知识点归纳
1.flex-shrink <div id="content"> <div class="box" style="backgroun ...
- html5与css3入门知识点精炼
<meta name = "keywords" content="…………"/>(网页搜索时要输入的关键字) <meta name = &qu ...
- 大三仍是Linux系统小白的我给大家讲讲学习历程
我与Linux结缘是在大三的时候.我与Linux熟识是在偶然遇到<Linux就该这么学>的时候.因为我是电子信息工程专业,在高年级时开设了嵌入式课程,嵌入式系统是一种专用的计算机系统,作为 ...
- Java编程思想读书笔记(一)【对象导论】
2018年1月7日15:45:58 前言 作为学习Java语言的经典之作<Java编程思想>,常常被人提起.虽然这本书出版十年有余,但是内容还是很给力的.很多人说这本书不是很适合初学者,我 ...
- flex布局知识点
flexBox 布局最合适小规模布局,而网格布局适合较大规模布局. float,clear,vertical-align 在flex中不起作用. flex布局中,有两类作用于父节点也子节点的样式,大 ...
- Flex 布局知识点梳理
传统的布局方案,在针对特殊布局时会很不方便,比如垂直居中,把一个容器等分为N列等等.自从 Flex 出现以后,这些都迎刃而解了,本文对Flex相关内容做一个简单梳理. 什么是 Flex Flex 是 ...
- flex布局知识点(阮一峰博客)
任何一个容器都可以指定为flex布局: 行内元素也可以使用flex布局: 设为flex布局以后,子元素的float,clear,vertical-align属性都将失效: flex容器的属性: fle ...
- Flex布局兼容知识点总结
转载,原文http://www.cnblogs.com/tugenhua0707/p/5180841.html,部分截取 假设父容器class为 box,子项目为item.旧版语法如下:一:定义容器的 ...
- 弹性盒子布局(display:flex)知识点
设为 Flex 布局以后,子元素的float.clear和vertical-align属性将失效.
随机推荐
- spring3+quartz2
听说来自这里www.ydyrx.com 转载的: 最近公司要用定时任务,自己想着学习并完成任务,百度,google,360,必应,能用的搜索都用了,参差不齐,搞了一整天,也没找到一个好的例子.没办法, ...
- mount 命令总结
配置CnetOS 7.4 本地yum源,记录下遇到的ISO镜像挂载问题,使用 blkid 命令可以查看设备的UUID.Label.文件系统类型(iso镜像文件系统类型iso9660) [root@lo ...
- Hadoop-2.2.0集群部署时live nodes数目不对的问题
关于防火墙,hadoop本身配置都确定没任何问题,集群启动不报错,但打开50070页面,始终live nodes数目不对,于是我尝试/etc/hosts文件配置是否存在逻辑的错误: 127.0.0.1 ...
- Selenium3+python自动化 单选框和复选框
一.认识单选框和复选框 1.先认清楚单选框和复选框长什么样 2.各位小伙伴看清楚哦,上面的单选框是圆的:下图复选框是方的,这个是业界的标准,要是开发小伙伴把图标弄错了,可以先抽他了. 二.radio和 ...
- NOIP2013 DAY2 T3火车运输
传送门 题目描述 A 国有 n 座城市,编号从 1 到 n,城市之间有 m 条双向道路.每一条道路对车辆都有重量限制,简称限重.现在有 q 辆货车在运输货物, 司机们想知道每辆车在不超过车辆限重的情况 ...
- HAOI2010软件安装(树形背包)
HAOI2010软件安装(树形背包) 题意 有n个物品,每个物品最多会依赖一个物品,但一个物品可以依赖于一个不独立(依赖于其它物品)的物品,且可能有多个物品依赖一个物品,并且依赖关系可能形成一个环.现 ...
- Vue + Element 小技巧
说是小技巧 ,其实就是本人 就是一个小菜比 .如有大佬可以纠正,或者再救救我这个小菜比 跪谢 1.当后台返回一个字段需要根据不同字段内容在表格内显示相对应的文字(字段内容是死的,表格内需要显示对 ...
- 【微软2017年预科生计划在线编程笔试第二场 A】Queen Attack
[题目链接]:http://hihocoder.com/problemset/problem/1497 [题意] 给你n个皇后; 然后问你其中能够互相攻击到的皇后的对数; 皇后的攻击可以穿透; [题解 ...
- NYIST 914 Yougth的最大化
Yougth的最大化时间限制:1000 ms | 内存限制:65535 KB难度:4 描述 Yougth现在有n个物品的重量和价值分别是Wi和Vi,你能帮他从中选出k个物品使得单位重量的价值最大吗? ...
- [bzoj1195][HNOI2006]最短母串_动态规划_状压dp
最短母串 bzoj-1195 HNOI-2006 题目大意:给一个包含n个字符串的字符集,求一个字典序最小的字符串使得字符集中所有的串都是该串的子串. 注释:$1\le n\le 12$,$1\le ...