2019-05-02 css布局套路

原则

• 不到万不得已，不要写死 width 和 height
• 尽量用高级语法，如 calc、flex
• 如果是 IE，就全部写死

---

口诀

1. float
   i. 儿子全加 float: left （right）
   ii. 老子加 .clearfix
2. flex
   i. 老子加 display: flex
   ii. 老子加 justify-content: space-between;

如果宽度不够，可以用 margin: 0 -4px;

.clearfix:after{
    content: '';
    display: block;
    clear: both;
}
.clearfix{
    zoom: 1;
}

---

1.百分比套路
2.float做平均布局
3.使用calc
4.使用flex
5.响应布局