请查看以下两个链接 http://www.tuicool.com/articles/Afq6Bzq http://www.sheng00.com/2148.html ...
分类：
微信 时间：
2016-07-01 18:16:58
阅读次数：
826
今天在公司做项目的时候，遇到一个让我无从下手的问题。 这样的一个父容器DIV包含连个不同的span标签。标签内的字体不一样，要如何实现两个标签在中轴线上实现垂直居中呢？ 其他办法我实在想不出来，于是在同事的建议下使用了弹性布局，也就是flex。 下面简单的介绍一下flex布局。可参考阮一峰的flex ...
分类：
其他好文 时间：
2016-06-30 21:43:22
阅读次数：
403
CSS3中新增一种弹性布局模型：flexbox。网上关于flex的介绍很多，这里介绍下常用的几个属性。弹性布局的特点是非常灵活。可根据剩余的宽高，灵活布局。 先用图片说明flex具有哪些属性。（网上盗的图） 上图中flex容器即是父元素，flex项目为子元素。 属性说明 1.首先在父元素中定义dis ...
分类：
其他好文 时间：
2016-06-30 18:04:18
阅读次数：
226
你会看到，不管是什么布局，Flex往往都可以几行命令搞定。
我只列出代码，详细的语法解释请查阅《Flex布局教程：语法篇》。我的主要参考资料是Landon
Schropp的文章和Solved by Flexbox。
一、骰子的布局
骰子的一面，最多可以放置9个点。
下面，就来看看Flex如何实现，从1个点到9个点的布局。你可以到codepen查看Demo...
分类：
其他好文 时间：
2016-06-28 12:57:32
阅读次数：
277
网页布局（layout）是CSS的一个重点应用。 布局的传统解决方案，基于盒状模型，依赖 display属性 + position属性 + float属性。它对于那些特殊布局非常不方便，比如，垂直居中就不容易实现。 2009年，W3C提出了一种新的方案 Flex布局，可以简便、完整、响应式地实现各种 ...
分类：
其他好文 时间：
2016-06-28 10:39:38
阅读次数：
164
网页布局（layout）是CSS的一个重点应用。
布局的传统解决方案，基于盒状模型，依赖 display属性
+ position属性 + float属性。它对于那些特殊布局非常不方便，比如，垂直居中就不容易实现。
2009年，W3C提出了一种新的方案----Flex布局，可以简便、完整、响应式地实现各种页面布局。目前，它已经得到了所有浏览器的支持，这意味着，现在就...
分类：
其他好文 时间：
2016-06-27 20:05:07
阅读次数：
255
Flex是Flexible Box的缩写，意为"弹性布局"，用来为盒状模型提供最大的灵活性。任何一个容器都可以指定为Flex布局。2009年，W3C提出了一种新的方案 Flex布局，可以简便、完整、响应式地实现各种页面布局。目前，它已经得到了所有浏览器的支持，这意味着，现在就能很安全地使用这项功能。 ...
分类：
Web程序 时间：
2016-06-24 12:18:45
阅读次数：
250
flex 是CSS3新属性。 flex概念： 在block,inline-block,inline 之外添加了一个伸缩自适应的元素。 flex使用： display：flex设置元素使用flex布局。内部元素自动为伸缩项目（item）。 flex-wrap：设置换行。wrap，nowrap。 fle ...
分类：
其他好文 时间：
2016-06-22 10:33:38
阅读次数：
142
昨天无意知道Normalize.css框架。于是在最近使用了h5属性的项目中引用来玩玩。但是习惯了用通配符去重置。在引用Normalize.css之后各种不适。最直接的影响，比如我对footer header等H5标签容器设置了display：flex;却没有任何效果。打开浏览器审查元素发现， No ...
分类：
Web程序 时间：
2016-06-14 06:24:30
阅读次数：
318
Flex是Flexible Box的缩写，意为"弹性布局"，用来为盒状模型提供最大的灵活性。设为Flex布局以后，子元素的float、clear和vertical-align属性将失效。 任何一个容器都可以指定为Flex布局。 flex-direction 设置主轴对齐方式 默认 row x轴从左到 ...
分类：
其他好文 时间：
2016-06-12 20:30:44
阅读次数：
514
