Flex是Flexible Box的缩写,意为”弹性布局”,用来为盒状模型提供最大的灵活性。 flex-direction 决定主轴的方向 row(默认值)主轴为水平方向,起点在最左端。 ...
分类:
其他好文 时间:
2017-07-11 10:19:45
阅读次数:
149
flex布局可以帮我们快速布局一些区块,实现你想要的效果,不用再去float,position之类的.我们在布局网页的时候很多时候都是一些特殊布局,flex就能帮我快速去布局,不需要去定位. 任何一个盒子都可以指定为flex布局,但是要注意,设为 Flex 布局以后,子元素的float、clear和 ...
分类:
其他好文 时间:
2017-07-09 10:58:53
阅读次数:
242
flex布局可以帮我们快速布局一些区块,实现你想要的效果,不用再去float,position之类的.我们在布局网页的时候很多时候都是一些特殊布局,flex就能帮我快速去布局,不需要去定位. 任何一个盒子都可以指定为flex布局,但是要注意,设为 Flex 布局以后,子元素的float、clear和 ...
分类:
其他好文 时间:
2017-07-08 21:55:12
阅读次数:
244
今天学习了flex布局,发现它是真心强大,所以必须的记录下。 以下简单的布局要求是难以或不可能用这样的工具方便且灵活的实现: 垂直居中父内容的里一块内容。 使容器的所有子项占用等量的可用宽度/高度,而不管有多少宽度/高度可用。 使多列布局中的所有列采用相同的高度,即使它们包含的内容量不同。 先上一个 ...
分类:
Web程序 时间:
2017-07-07 20:16:38
阅读次数:
245
阅读目录 移动开发基本知识点 calc基本用法 box-sizing的理解及使用 理解display:box的布局 理解flex布局 Flex布局兼容知识点总结 回到顶部 移动开发基本知识点 一. 使用rem作为单位 html { font-size: 100px; } @media(min-wid ...
分类:
移动开发 时间:
2017-07-06 15:54:07
阅读次数:
311
概念: 弹性盒布局模型(Flexble Box Layout)是css3规范中提出的一种新的布局方式。他可以用简单的方式满足很多常见的布局需求。 基本概念: 采用flex布局的元素,称为flex容器,简称“容器”。他的所有子元素自动称为容器成员,称为flex项目,简称“项目”。 容器?默认存在两根轴 ...
分类:
其他好文 时间:
2017-07-03 23:45:24
阅读次数:
211
左侧定宽,右侧自适应是一种常见的布局方式,比如好多后台和外卖点餐页面。常用的几种方案如下:方案1,使用flex布局:在线效果http://jsrun.net/FeYKp ...
分类:
Web程序 时间:
2017-06-30 17:12:00
阅读次数:
208
flex是flex-grow,flex-shrink和flex-basis三个属性的缩写。第二个和第三个参数(flex-shrink和flex-basis)是可选值。其默认值是0 1 auto。 flex-grow属性定义项目的放大比例,默认为0,即如果存在剩余空间,也不放大。 flex-shrin ...
分类:
其他好文 时间:
2017-06-27 13:43:32
阅读次数:
248
Flex 布局 和 border:left/right 。文字分割线自定义样式。 ...
分类:
其他好文 时间:
2017-06-22 10:14:48
阅读次数:
294
最近越来越依赖display:flex 了。本来只是在移动端用来作弹性布局,现在在PC端,我基本用它来取代 float:left。比如昨天做的一个专题,基本都用 flex 来布局。 但是这其中的原理呢,flex布局的相对于float的优势又在哪呢。只是对这些有一个模糊的概念。 比如float:lef ...
分类:
其他好文 时间:
2017-06-21 13:54:09
阅读次数:
261