先说一下flex一系列属性： 一、flex-direction: （元素排列方向） ※ flex-direction:row （横向从左到右排列==左对齐） ※ flex-direction:row-reverse （与row 相反） ※ flex-direction:column （从上往下排列= ...
分类：
其他好文 时间：
2019-04-30 10:46:07
阅读次数：
127
本文转自：https://www.cnblogs.com/nuannuan7362/p/5823381.html 一、简要介绍 css3最喜欢的新属性之一便是flex布局属性，用六个字概括便是简单、方便、快速。 flex（ flexible box：弹性布局盒模型）,是2009年w3c提出的一种可以 ...
分类：
其他好文 时间：
2019-04-25 11:55:26
阅读次数：
114
1、flex布局 案例一： 案例二： 保证不至于缩放得太小或太大 案例三：flex的值不一定要写成几份，可以写成固定值 案例四： 竖着3等分（父容器按照高度3等分） !!案例 用flex布局写携程网（发现携程网是伸缩布局：根据屏幕自适应） flex: 2 意义是啥 （剩余宽度里占比2等份） flex ...
分类：
Web程序 时间：
2019-04-21 10:18:15
阅读次数：
178
以前常用的页面布局是浮动和定位；后来css3的flex布局解决了浮动的一些主要缺点(无法撑起父元素，需要清除浮动) 任何一个容器都可以指定为 Flex 布局。 flex 主要属性表现： (1). 指定为flex display:flex; (2). 指定 方向 flex-direction: row ...
分类：
其他好文 时间：
2019-04-17 15:08:03
阅读次数：
131
首先，flex布局的迷之属性们，如果一知半解，机械记忆的话，那不到半个月基本忘光光。先感受一下这12个flex布局属性，是不是很“迷”人。 容器属性 flex-flowflex-directionflex-wrapjustify-contentalign-itemsalign-content 元素属 ...
分类：
其他好文 时间：
2019-04-15 18:14:57
阅读次数：
151
（1）弹性容器与弹性元素 对于某个元素只要声明了display: flex;，那么这个元素就成为了弹性容器，具有flex弹性布局的特性。 弹性容器的两根轴非常重要，所有属性都是作用于轴的。下面从轴入手，将所有flex布局属性串起来理解。 （2）主轴方向 可以在弹性容器上通过flex-directio ...
分类：
其他好文 时间：
2019-04-15 12:00:35
阅读次数：
179
2009年，W3C提出了一种新的布局方案—-Flex 布局，可以简便、完整、响应式地实现各种页面布局。 目前，它已经得到了所有浏览器的支持，这意味着，现在就能很安全地使用这项功能。 一，怎么运用FLEX布局 flex布局非常灵活，任一容器都可以指定为flex布局。块状只需要display属性规定为f ...
分类：
其他好文 时间：
2019-04-12 11:49:43
阅读次数：
125
display:flex;justify-content: center;检查侧轴是否居中，比如古代竖着写字，检查字是否在每条竹简的中央。 display:flex;align-items: center;检查横轴是否居中，比如现代人是横着写字，检查字是否写在上下横线的中间。 display:fle ...
分类：
其他好文 时间：
2019-04-10 13:23:34
阅读次数：
119
圣杯布局与双飞翼布局针对的都是三列左右栏固定中间栏边框自适应的网页布局 三列布局，中间宽度自适应，两边定宽 中间栏要在浏览器中优先展示渲染 允许任意列的高度最高 显示如图： (1)、浮动布局（float+calc） (2)、绝对布局（absolute+calc） (3)、flex布局 . ...
分类：
其他好文 时间：
2019-04-06 14:10:56
阅读次数：
119
浮动布局和定位布局为css中布局的常用的两种布局方式，而且兼容性会比较好。随着flex的流行，以后会是主流，新的东西好用，兼容不太好。IE10以下不兼容flex布局。 float布局会脱离文档流，对页面的布局造成影响，比如造成父级的高度坍塌等问题。清除浮动后，便不会影响文档流。下面介绍一下现在清除浮 ...
分类：
Web程序 时间：
2019-03-29 19:23:28
阅读次数：
220
