外边距与内边距

把元素想成一个箱子：padding（内边距）是箱壁和里面物品之间的填充，margin（外边距）是这个箱子和旁边箱子之间的空隙。一个简单的判断方法：背景色会铺到内边距里，不会铺到外边距里。想让按钮变大、文字离边框远一点，用 padding；想让两张卡片分开，用 margin。

padding: 8px 16px 表示上下 8px、左右 16px。普通排版中上下相邻的两个元素，外边距会合并成较大的那个而不是相加，这叫外边距折叠，常让人困惑。

在 Flex 和 Grid 里，子元素之间的距离更推荐用 gap，比给每个子元素写 margin 省事。