三栏布局的n种实现

本文主要讨论左右边栏固定宽度，中间栏填满其余空间的布局。至于其他类型，基本上也就是半斤和八两。每一种布局都会有个Demo，个人依然认为文章里帖代码并没有Demo来的直接。所以正文负责解释，源码参见Demo。其中讨论了这么多种（6种）布局，有以下理由：1是每种布局也都有他的毛病，没有十全十美的，每种布局也都有人在用。2是虽然有相对优秀的方案，但是不优秀的方案也有有用的东西在里

业界 2016年07月06日

React Native 布局浅探

简述在Web开发中，页面布局基于盒子模型，主要通过定位属性、浮动属性和显示属性实现。以div作为容器将页面分成一个个小区块，再根据一定的方式在页面进行排布。但是对于较为复杂的布局或者手持设备来说，上述几种方式实现起来十分繁琐。于是W3C引入了一种新型的布局方式Flex布局。React Native就是采用了这种方式，但它不是完整的web Flex布局。通过一张图来大致了解f

业界 2016年07月13日

flebo 详细教程

caniuseflexbox 神器肯定是前端必会的。对于各种布局只要学会 flexbox 那都是 so easy 的事情。要用 flexbox，最先就是看看 caniuse 上浏览器对 flexbox 的兼容性。下面是截图：图片中 partial support 的左上角的数字对应下面的意思。具体和访问链接去看,:caniuse 上浏览器对 flexbox 的兼容性.部分支

业界 2016年07月14日

React Native 布局浅探

简述在Web开发中，页面布局基于盒子模型，主要通过定位属性、浮动属性和显示属性实现。而React Native采用的是Flex布局，但也支持盒子模型的margin、padding以及定位属性进行布局。flex的布局方式cove

业界 2016年07月16日

移动端从入坑到出坑

1.局部滚动项目名称：果之友地址：http://www.guozhiyou.com/Inde...问题描述：要将红色的这块做局部滚动。解决办法：先通过window.innerHeight读取到当前屏幕的高度，然后通过减去header和footer的高度，得到div的高度并且赋值上去，同时设置overflow:scroll，成功实现弹性滚动。但设置为局部滚动后会发现ios端和

业界 2016年07月27日

你所不知道的 CSS - 居中

你所不知道的 CSS - 居中这次翻译一篇来自 Chris Coyier 的 《Centering in CSS: A Complete Guide》前言居中是在CSS中经常被抱怨的问题之一。这个问题真的有这么难吗？事实上这个问题并没有那么复杂，它困难在于对于不同的情景，解决居中问题需要用到不一样的方法。在这里，我们会一起建立思维导图来帮助大家来解决这个问题。github

业界 2016年08月01日

使一个div垂直+水平居中的几种方法

前几天去一家互联网公司面试，面试官问到了这个应该算是比较简单的问题，在我自认为回答正确时，才知道这道题的答案有很多种，下面就让我们一起来探讨一下这个问题：思路1：绝对定位居中（原始版）这个是我回答出来的，也是被各位所熟知的一种方法，设外层div相对定位，内层div绝对定位，top、left分别设为50%，然后通过设置margin-top、margin-left值为宽度的负数

业界 2016年08月05日