1. 移动web与电脑端web1.1 两者布局的区别1.1.1 电脑端web在做电脑端页面布局时,给页面设置的常为固定的长和宽,为的是页面不会因为不同分辨率和不同浏览器发生页面布局的错位.现在我们也能通过给父盒子设置display:flex;来实现弹性布局,可以通过只对父盒子设置宽高,实现盒子内部的 ...
分类：
移动开发 时间：
2016-09-16 22:50:19
阅读次数：
248
篇教程将引导大家如何使用“em”来创建一个基本的弹性布局，从而学习其如何计算？又是如何使用“em”对层进行弹性扩展？又是如何扩展文本和图像等内容？下在我们就一起带着这些问题开始今天的“em”之行。 什么是弹性布局？ 用户的文字大小与弹性布局 用户的浏览器默认渲染的文字大小是“16px”，换句话说，W ...
分类：
Web程序 时间：
2016-09-13 11:19:15
阅读次数：
248
这几天在研究弹性布局，看书中写的是display:box，结果在chrome浏览器中是正常的，想着移动端大部分浏览器也是webkit内核的应该也没啥问题，结果确实没问题，但仔细一看，高度呢？好吧，严重的bug，高度不起作用了（特殊情况）。再查查资料原来w3c已经废了display:box;换成dis ...
分类：
其他好文 时间：
2016-09-12 15:41:41
阅读次数：
202
流体布局 弹性布局 混合布局 实现方式 百分比 把px转化成em(width) 用em设置宽度，用百分比设置最大宽度 缺点 改良方法 设置min-width 设置max-width ps:一般浏览器的默认字号是16px，在使用默认字号时1em相当于10px ...
分类：
其他好文 时间：
2016-09-12 06:14:14
阅读次数：
126
第 29章 CSS3弹性伸缩布局[上]学习要点：1.布局简介2.旧版本 本章主要探讨 HTML5中 CSS3提供的用来实现未来响应式弹性伸缩布局方案，这里做一个初步的了解。一．布局简介CSS3提供一种崭新的布局方式：Flexbox布局，即弹性伸缩布局模型(Flexible Box)。用来提供一个更加 ...
分类：
Web程序 时间：
2016-09-11 17:03:45
阅读次数：
192
Flexbox布局（ Flexible Box 或CSS3 弹性布局），是CSS3中的一种新的布局模式，是可以自动调整子元素的高和宽，来很好的填充任何不同屏幕大小的显示设备中的可用显示空间，收缩内容防止内容溢出，确保元素拥有恰当的行为的布局方式。使用Flexbox来布局更容易，可以使用更少的代码，更 ...
分类：
其他好文 时间：
2016-09-06 13:53:08
阅读次数：
119
(子容器%父容器)*100 png透明ie6中filter:progid:DXImageTransfornm.Microsoft.AlphaImageLoader( src='路径',sizingMethod='crop');)behavior:url(iepngfix.htc)让一个div水平、垂 ...
分类：
Web程序 时间：
2016-09-06 13:49:52
阅读次数：
239
一：理论知识点 1:什么是FlexBox布局? 弹性盒模型（The Flexible Box Module）,又叫Flexbox，意为“弹性布局”，旨在通过弹性的方式来对齐和分布容器中内容的空间，使其能适应不同屏幕，为盒装模型提供最大的灵活性。 Flex布局主要思想是：让容器有能力让其子项目能够改变 ...
分类：
其他好文 时间：
2016-09-05 17:04:59
阅读次数：
143
为了适应各种屏幕尺寸，iOS 6后引入了自动布局（Auto Layout）的概念，通过使用各种 Constraint（约束）来实现页面自适应弹性布局。 在 StoryBoard 中使用约束实现自动布局很方便，但如果用纯代码来设置约束就很麻烦了。这里向大家推荐一个好用的第三方布局库：SnapKit（其 ...
分类：
编程语言 时间：
2016-09-05 16:49:34
阅读次数：
495
相信很多刚开始写手机界面的同学都要面对页面自适应的问题，当然解决方案很多，比如：百分比布局，弹性布局flex，响应式布局…… 这里主要介绍的是本人在实践中用的最顺手最简单的布局方案，以及要注意的一些事情。 1，head里边加入代码： <meta name=”viewport” content=”wi ...
分类：
移动开发 时间：
2016-08-31 17:11:47
阅读次数：
293
