padding-top增加内容与上边框距离，使内容下移；padding-bottom增加与下边框距离，使内容上移。两者分别控制上下内边距，影响布局方向相反，可单独或组合使用以实现视觉平衡和空间调整。
在CSS中，padding-top 和 padding-bottom 都是用来设置元素内部填充的属性，但它们作用的方向不同，影响元素内容与上下边框之间的距离。
padding-top：控制内容与上边的距离
这个属性用来增加元素内容与其**上边界**之间的空白区域。值越大，内容离顶部越远。
常见用法示例：- 让文字不紧贴盒子的上方
- 垂直居中时配合其他样式调整位置
- 避免内容被背景图像或装饰遮挡
padding-bottom：控制内容与下边的距离
它设置的是元素内容与其**下边界**之间的内边距。增大该值会使内容整体看起来更靠上。
典型使用场景：- 防止内容紧贴底部边框
- 为下方元素留出视觉空间
- 配合背景色或阴影营造层次感
关键区别总结
padding-top 影响顶部空白，padding-bottom 影响底部空白。虽然都增加元素内部空间，但方向相反，视觉效果也不同。它们可以单独使用，也可以同时设置以达到对称或非对称布局需求。
立即学习“前端免费学习笔记（深入）”；
比如一个 div 设置了高度和背景色，只加 padding-top 会让内容下沉；只加 padding-bottom 则内容看似上移（实际是底部空出来）。
基本上就这些，合理运用这两个属性能更精准地控制页面的间距和视觉平衡。
