网页布局(layout)是CSS的一个重点应用。
复制代码
布局的传统解决方案，基于盒状模型，依赖 display属性
+ position属性
+ float属性。它对于那些特殊布局非常不方便，比如，垂直居中就不容易实现。
2009年，W3C提出了一种新的方案----Flex布局，可以简便、完整、响应式地实现各种页面布局。目前，它...
分类：
其他好文 时间：
2015-08-28 09:36:33
阅读次数：
225
Flex布局官方称为CSS Flexble Box 布局模型是CSS3为了提高元素在容器中的对齐、方向、顺序，甚至它们是动态的或者不确定大小的新布局模型。Flex容器的主要特征是能够调整其子元素在不同的屏幕大小中能够用最适合的方法填充合适的空间。
很多的设计师和开发者发现Flex布局很容易使用，它定位元素简单因此很多复杂的布局能够用很少的代码实现，引领更简单的开发过程。Flex布局的算法是基于方向的，不同于基于水平或者垂直的block和inline布局，这种Flex布局可以被用在小的应用组件中，而CSS3...
分类：
Web程序 时间：
2015-08-15 01:35:39
阅读次数：
236
flex：定义布局为盒模型flex-v：盒模型垂直布局flex-1：子元素占据剩余的空间flex-align-center：子元素垂直居中flex-pack-center：子元素水平居中flex-pack-justify：子元素两端对齐兼容性：ios 4+、android 2.3+、winphone...
分类：
其他好文 时间：
2015-08-13 11:34:01
阅读次数：
203
前阵子我突然在技术群里看到有人提起flex布局。以前没听说过，只能怪我平常没有好好学习。找了度娘才知道原来早就出来了。这次做的页面主要是显示在移动端的，所以我尝试用了flexbox布局。1、页面分析：主要分为两部分，图片与文字的混排，左右两栏，自适应。页面的主要代码如下： ...
分类：
其他好文 时间：
2015-07-30 13:29:27
阅读次数：
162
昨天拿到设计稿后，发现设计师设计的边框阴影比较特别，我平常没有接触过。所以一开始我是直接切图和把边框当做背景来使用。等把页面全部做来后，我在网上搜了box-shadow相关方面的文章，发现还是有很多牛人总结了。下面就是我学习后的结果。 ...
分类：
其他好文 时间：
2015-07-27 20:33:23
阅读次数：
113
网页布局(layout)是CSS的一个重点应用。 布局的传统解决方案，基于盒状模型，依赖 display属性 + position属性 + float属性。它对于那些特殊布局非常不方便，比如，垂直居中就不容易实现。 2009年，W3C提出了一种新的方案----Flex布局，可以简便、完整、响应式.....
分类：
其他好文 时间：
2015-07-22 18:32:36
阅读次数：
130
.row {/*横*/ display: -webkit-box;// display: -webkit-flex; /* Safari */ display: -moz-box; display: -moz-flex; display: -ms-flexbox; display: flex; wi...
分类：
其他好文 时间：
2015-07-22 18:05:14
阅读次数：
132
网页布局（layout）是CSS的一个重点应用。布局的传统解决方案，基于盒状模型，依赖display属性 +position属性 +float属性。它对于那些特殊布局非常不方便，比如，垂直居中就不容易实现。2009年，W3C提出了一种新的方案—-Flex布局，可以简便、完整、响应式地实现各种页面布局...
分类：
其他好文 时间：
2015-07-13 10:05:13
阅读次数：
173
一、结构倒序显示经历，第一行是时间与公司，第二行是行业，第三行是工作内容，这里也是用了flex布局，图表是用个canvas画布画出来的。下图是大屏幕下的显示方式：移动端的显示如下： 2014/5--2014/9：大...
分类：
其他好文 时间：
2015-07-02 13:52:17
阅读次数：
98
1、伸缩项目的布局方式-从左到右 1 1 1 .box{ width: 250px; padding: 10px; background: #999; margin: 10px;}.box li{ width: 100px...
分类：
Web程序 时间：
2015-05-13 19:32:33
阅读次数：
154
