前面已经详细介绍过flex弹性盒模型的基本语法和兼容写法，本文将介绍flex在布局中的应用 元素居中 【1】伸缩容器上使用主轴对齐justify-content和侧轴对齐align-items <style> .parent{ display: flex; justify-content: cent ...
分类：
Web程序 时间：
2016-11-24 07:16:25
阅读次数：
173
在React Native中主要使用FlexBox来布局。什么是FlexBox布局?
弹性盒模型（The Flexible Box Module）,又叫Flexbox，意为“弹性布局”，...
分类：
其他好文 时间：
2016-11-20 19:41:05
阅读次数：
281
弹性盒子由弹性容器(Flex container)和弹性子元素(Flex item)组成。 弹性容器通过设置 display 属性的值为 flex 或 inline-flex将其定义为弹性容器。 弹性容器内包含了一个或多个弹性子元素。 display: -webkit-box; /* 老版本语法: ...
分类：
Web程序 时间：
2016-11-13 17:00:28
阅读次数：
185
flex-direction (适用于父类容器的元素上) 设置或检索伸缩盒对象的子元素在父容器中的位置。 语法 flex-direction: row | row-reverse | column | column-reverse row：横向从左到右排列（左对齐），默认的排列方式。 row-rev ...
分类：
其他好文 时间：
2016-11-05 14:18:06
阅读次数：
138
参考：https://segmentfault.com/a/1190000003978624 ...
分类：
Web程序 时间：
2016-11-04 20:10:49
阅读次数：
167
一，概念 flexible box ,意为“弹性布局”，用来为盒状模型提供最大的灵活性。 块级布局更侧重于垂直方向，行内布局更侧重于水平方向，于此相对的，弹性盒子布局算法是方向无关的。 块级flex布局： 行内元素flex布局： webkit内核的浏览器，必须加上-webkit前缀： 注意：设为fl ...
分类：
其他好文 时间：
2016-11-01 13:57:07
阅读次数：
145
最近 看了一些弹性盒子布局的文档 总结如下 弹性盒子布局 1 第一种 平均分配 CSS *{ margin: 0; padding: 0; } .flexContainer{ display: flex; display: -webkit-flex; width: 400px; height: 25 ...
分类：
其他好文 时间：
2016-10-30 16:38:06
阅读次数：
149
近期在做移动端的项目过程中，经常听到有人说用弹性盒布局来写比较快，因为我一直用的是传统的百分比布局（好吧，不敢否认我还是喜欢用拿手的，但是不要鄙视我对新技术的热情），因此一直也想抽空学习下弹性盒布局，看看他到底是何方神圣，能够用到哪些场合，还有浏览器兼容性到底怎么样 一、语法 应用flex布局，首先 ...
分类：
其他好文 时间：
2016-10-30 14:02:57
阅读次数：
398
请用弹性盒模型原理写出类名为divA divB divC三个元素横排三列（出divA宽度为50px，以外，其他平分剩余空间）的HTML与CSS。 <style> body{ margin:0; padding:0; } .box{ width:100%; height:50px; display:f ...
分类：
其他好文 时间：
2016-10-09 07:09:16
阅读次数：
127
第一种， 针对内联元素居中. 2: 弹性盒子 3translate ...
分类：
Web程序 时间：
2016-10-08 19:12:11
阅读次数：
229
