Darbuly的博客

1. 需求分析 要达到如下效果 2. 代码 /*1. 容器声明*/ ul { list-style:none; display: flex;/*必须，flex声明*/ flex-wrap: wrap;/*必须，指定可以换行*/ width: 500px;/*必须，一定要固定宽度，100%都不行*/ margin:auto;/*非必须，为了在中间好看*/ justify-content: space-between;/*非必须，富裕空间

1、 需求分析 要实现一个左边宽度固定，右边的宽度自动铺满的布局，效果如下 2. 代码实现： /*1. 容器的声明*/ .container { display: flex; width: 100%; height: 300px; border: 1px solid red; } /*2. 项目的声明*/ .left { width: 100px;/*必须，左固就得固*/ background: blue; }