css左侧部分宽度固定、右侧部分宽度随浏览器宽度的变化而自适应变化

有如下二种实现思路:

1、通过绝对定位实现

注意点如下:

需要套一个“positioned”的父元素

div-a 绝对定位,并将位置调整为浏览器左上角

div-b margin-left 属性值为 div-a 的宽度(因为 div-a 绝对定位已经脱离文档流,故不设定为 div-a 宽度的话,会相互覆盖)

div-c 绝对定位并将位置调整为正下方

需要自适应的 div 均设定宽度为100% 

 

2. 通过浮动实现

注意点如下:

div-a 设定为左浮动

div-b 与上面一样需要将 margin-left 属性值设为 div-a 的宽度,原因同上,浮动也会脱离文档流

div-c 最好清除浮动,避免浮动的影响

 

posted @ 2016-08-03 13:24  Maroon6  阅读(265)  评论(0)    收藏  举报