效果：整个页面分为三栏，左右两栏都是固定宽度，中间栏根据屏幕大小宽度相应变化。
实现：
HTML部分：
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><meta http-equiv="X-UA-Compatible" content="ie=edge" /><link rel="stylesheet" href="./index.css" /><title>用 Flex 实现三栏自适应布局</title></head><body><div class="flex-auto"><div class="static"></div><div class="flexible"></div><div class="static"></div></div></body></html>
CSS部分：
.flex-auto {padding: 4px;background: #282A35;height: 100px;display: flex;}.flex-auto .static {background-color: #D5E8D4;width: 100px;flex: none;}.flex-auto .flexible {background-color: #FFF2CC;width: 100px;flex: 1;}
