第 9 课 2 / 25 ｜ 编码：L09-06
核心知识

盒模型的四个区域

先把一张活动卡片拆开看：文字、留白、边框和外部间隔分别在哪里？

content：内容区
放置文字、图片等内容。
padding：内边距
内容与边框之间的留白。
border：边框
包围内容区和内边距的边界。
margin：外边距
边框外侧的空间，不涂绘元素的背景。
观察：让文字远离边框与让两张卡片远离，应该改同一个属性吗？
展开参考分析

前者通常增加 padding；后者可调整 margin，也可在后续布局中使用间隙属性。图中橙色只是外边距的示意色，真实的外边距是透明的。

补充：这张图讨论什么范围？

先讨论常见的矩形 CSS 盒子。display: none 不生成布局盒；跨行的行内内容也不一定只对应一个矩形。