三栏布局,顾名思义就是两边固定,中间自适应。三栏布局在开发十分常见,那么什么是三栏布局?比如我打开某东的首页:

映入眼帘的就是一个常见的三栏布局:即左边商品导航和右边导航固定宽度,中间的主要内容随浏览器宽度自适应。

下面围绕的这样的目的,即左右模块固定宽度,中间模块随浏览器变化自适应,想要完成的最终效果如下图所示:

红色和蓝色宽度固定,绿色宽度自适应,下面七种方法实现的最终效果跟这个差不多,可能会稍有不同。

下面七种技巧各有千秋,在开发中可以根据实际需求选择适合自己的方法进行编码。

1. 流体布局

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。