CSS 盒模型
盒模型是CSS设计中的基础概念，它描绘了元素在页面上呈现的几何结构。每个元素就像一个矩形框，由内容（元素的核心内容）、内边距（填充）、边框和外边距（空白区域）四部分组成。
框的核心是内容区域，周围是内边距，它与内容直接相邻。边框则位于内边距的外部，通常为可见的线条。默认情况下，外边距是透明的，不会影响其他元素的布局。
盒模型的背景规则是，它仅作用于内容和内边距、边框围成的区域。元素的尺寸计算是基于内容的，而内边距、边框和外边距的增加不会改变内容区域的大小，但会扩展元素框的总尺寸。
例如，一个元素要达到100px宽，即使有10px的外边距和5px的内边距，内容区域仍需设置为70px。jQuery提供了检测尺寸的方法，如width()和height()，帮助我们处理这些细节。
CSS中的内边距、边框和外边距可以通过padding、border-width和margin属性进行设置。内边距（padding）定义了元素内容与边框之间的空间，可以按需要单独或按边设置。边框（border）则可以设置宽度、样式和颜色，有单边边框样式属性。外边距（margin）控制元素与相邻元素的距离，可以使用像素或百分比值。
边框的透明性允许其更像是内边距，提供了额外的灵活性。外边距的默认值是0，但浏览器可能为特定元素预设了样式，如段落元素的上下空行。理解外边距合并的规则，有助于避免意外的空间合并。
多重随机标签