CSS 知识点集锦一

---

学习计划参考字节飞书的学习计划 - 超清楚（必看）)

部分内容摘自MDN CSS(层叠样式表)

---

一、盒模型

盒模型基本概念

定义：当对一个文档进行布局（lay out）的时候，浏览器的渲染引擎会根据标准之一的 CSS 基础框盒模型（CSS basic box model），将所有元素表示为一个个矩形的盒子（box）

盒模型的组成：从内到外分别为：内容 content、padding 内边距、border 边框、margin 外边距;

标准盒模型（content-box）和 IE 盒模型（border-box）

CSS 提供了box-sizing 属性：

（默认值）content-box: width 和 height 只包含 内容 content 的width和height，不包含 padding 和 border，即

• width = 内容宽度
• height = 内容高度

border-box: width 和 he