圣杯布局的实现方式
迪丽瓦拉
2024-06-02 05:55:50
0次
1.什么是圣杯布局？
左右盒子固定，中间盒子自适应
2.实现方式
（1）flex布局
思路：左右盒子给固定的宽高，中间盒子flex:1
Document
盒子1
盒子2
盒子3
（2）浮动
思路：左盒子左浮，右盒子右浮，中间盒子不动，要注意布局顺序，盒子3在盒子2前面
Document
盒子1
盒子3
盒子2
（3）定位
思路：父级相对定位、左右绝对定位，中间盒子不动
Document
盒子1
盒子2
盒子3
