当前位置:首页 > 建站知识 > 网络营销知识 > 圣杯网页布局和flex网页布局之间的比较

圣杯网页布局和flex网页布局之间的比较

来源:明企上海网站建设     已被阅读:3949

上海做网站 明企设计师前几天在逛论坛的时候,看到有人在讨论圣杯网页布局和双飞翼布局方式,有一部分观点认为圣杯布局和双飞翼布局方式已经是过去式了,快要被淘汰了。当下流行趋势是flex布局。上海做网站的设计师觉得这个观点很有意思,也想发表自己的一些看法。
网页布局方式
我们先来说说圣杯布局和双飞翼布局,这两种布局文式基本上是一致的,都是两边固定宽度,中间自适应的三栏布局,其中,中间栏放到文档流前面,保证先行渲染。解决方案大体相同,都是三栏全部float:left浮动,区别在于解决中间栏div的内容不被遮挡上,圣杯布局是中间栏在添加相对定位,并配合left和right属性,效果上表现为三栏是单独分开的(如果可以看到空隙的话),而双飞翼布局是在中间栏的div中嵌套一个div,内容写在嵌套的div里,然后对嵌套的div设置margin-left和margin-right,效果上表现为左右两栏在中间栏的上面,中间栏还是100%宽度,只不过中间栏的内容通过margin的值显示在中间。

flex 布局又称 弹性盒子 布局,现今虽已得到众高端浏览器厂商的支持,上海做网站 发现由于IE10以下的用户基数仍然很大,大部分Web开发者并不能够真正在某种程度上大胆尝试这种新型布局理念。  Flex布局的主要思想是让容器能使其子元素的宽高(或其他属性)能够以最好的方式去填充可用空间(主要是去适应不同的设备跟分辨率)。一个Flex弹性盒子能让子元素填充可用空间或者为了阻止子元素超出区域而进行收缩。

综上所述,上海做网站 设计师认为Flex布局正处在蓬勃发展时期,Flex布局和圣杯布局就是新旧事物之间转换的过程,不存在谁被谁淘汰。在网站建设实际过程中,根据需要选择是用圣杯布局,或是flex布局。

[圣杯网页布局和flex网页布局之间的比较]网址:http://www.mq163.net/wangluoyingxiaozhishi/detail_416.htm 转载需注明出处。

网站建设流程

  • 需求分析

  • 费用计算

  • 签订协议

  • 创意设计

  • 修改反馈

  • 网站测试

  • 售后维护