7种方法实现CSS左侧固定，右侧自适应布局，css画三角形，上三角形，下三角形，左三角型，右下三角形，右上三角形，左上三角形，

7种方法实现CSS左侧固定，右侧自适应布局

左侧内容固定，右侧自动占满屏幕布局是开发中常见的布局，通常可见于一些管理后台：左侧展示菜单栏，右侧展示管理内容。
今天整理了7种实现这种布局的方法：

一：float+bfc ，左侧宽度不需要固定，但父级容器宽度需大于左侧宽度，否则右侧被挤压无法展示

 /*左浮动固定宽度，右边盒子overflow:hidden触发bfc，使其不与浮动盒子区域重叠，因此会重新计算宽度。*/
        .container1 .left{
   
            float: left;
            width: 100px;
        }
        .container1 .right {
   
            overflow: hidden