当前位置: 代码迷 >> 综合 >> 网页布局扩展?
  详细解决方案

网页布局扩展?

热度:6   发布时间:2024-01-26 12:11:45.0

网页布局扩展?

1.等高布局:指一侧高度增加,另一侧高度也随之增加。 利用的是margin-bottom负值和padding-bottom正值来实现的,因为撑开一个盒子的高度实际上是margin+content。

2.双飞翼布局:指左右侧固定,中间自适应。适合做三列布局。

  方法一:BFC方式    方法二:定位  方法三:浮动(双飞翼布局、圣杯布局)

  方法四:flex弹性

   双飞翼布局:先写中间部分,然后是左浮动。然后左右两边div用的是margin-left负值来实现,也是左浮动。最后中间部分的内容需要设置一个容器来设置margin用来空出左右固定的宽度即可实现中间自适应效果

  圣杯布局:和双飞翼布局一样都要用到float、margin负值,但圣杯布局还需要用到相对定位、

  相关解决方案