2021-07-28 响应式布局：左侧宽度固定右侧宽度自适应、双飞翼布局、圣杯布局

三种布局都是最先加载出主体。
双飞翼布局与圣杯布局都是 中间盒子宽度自适应，最先加载出主体
双飞翼布局与圣杯布局的不同之处在于：
双飞翼布局在主体内容中添加了一个div ，并对主体添加margin来使左右盒子不覆盖主体。
而圣杯布局并没有在主体中添加新的div，只是对整体添加左右填充、左右盒子添加相对定位，来达到效果。

左侧宽度自适应

body中需要先写出自适应宽度的div

	<div class="box">
        <div class="right">right</div>
        <div class="left">left</div>
    </div>

style中

.right {
   
            height: 400px;
            width: 100%;
            background-color: yellow;
            float:left;
        }
        .left {
   
            height: 200px;
            width: 200px;
            background