元素最终渲染高度 = content 高度 + padding-top + padding-bottom + border-top + border-bottom（标准盒模型），padding 独立撑开空间且不受 line-height 影响。
padding 如何参与元素总高度计算
元素的最终渲染高度由 content 高度 + padding-top + padding-bottom + border-top + border-bottom 共同决定（标准盒模型）。padding 是「实实在在撑开空间」的部分，它直接加在内容区域之外，且始终生效——哪怕内容为空，只要设置了 padding，元素就有对应高度。
注意：padding 不受 line-height 影响，也不会被 line-height 覆盖或压缩；它是独立于行内布局的盒模型层级属性。
- 块级元素设置
padding: 20px→ 上下各增加 20px 高度 -
box-sizing: border-box会把padding和border吸收进设定的height内，但实际占据的空间不变 - 如果元素只有文本且未设
height，padding仍会推高整个框，哪怕line-height算出的行高更小
line-height 对高度的实际影响范围
line-height 只作用于「行内内容」的垂直对齐和行间距，它不直接改变盒模型高度，但会间接抬升块容器的最小高度（尤其当内容为纯文本、无其他块级子元素时）。
关键点在于：当块容器没有显式 height，其 min-height 由「行盒（line box）的高度」决定，而该高度 ≈ font-size × line-height（按数值计算），再叠加 padding 才是最终渲染高度。
