关于自适应布局的处理(利用浮动和margin负边距实现)

王朝学院·作者佚名  2016-08-09  
宽屏版  字体: |||超大  

自适应布局在实际应用中越来越普遍了,今天分享几个自适应布局的demo,主要是浮动圣杯布局(也叫双飞翼布局,主要是利用浮动和margin负边距实现的),没有介绍绝对定位布局,都是我想,你能明白我下面的几个例子,绝对定位布局也是非常的简单了。

PS:圣杯布局有个好处,符合前端开发中渐进增强的理念,因为浏览器解析是从DOM的上至下,圣杯布局能够把页面中重要的内容section放到DOM前面先解析,而次要的aside内容则放在DOM后面后解析。

下面的例子能够解决实际应用中绝大多数的自适应布局问题了,有兴趣的童鞋可以研究下,代码如下:

1.左边固定,右边自适应(圣杯布局的实现):

复制代码

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
© 2005- 王朝网络 版权所有