CSS继承由属性本身决定，color、font-family、font-size、line-height、text-align、cursor、visibility等文本与交互属性默认可继承，而margin、padding、border、background等布局属性不可继承。
CSS 继承不是“用了就能继承”，而是由属性本身决定的——color、font-family 这类会自动向下传，margin、background 这类压根不传，强行写也没用。
哪些 CSS 属性默认会继承？
只有一小部分属性支持默认继承，集中在文本和交互表现上。浏览器不会“猜”你要不要传 padding，它只按规范走。
-
color、font-family、font-size、font-weight、line-height、text-align、cursor、visibility—— 这些基本都会逐层向下生效 -
border、margin、padding、width、height、background、display、position—— 全都不继承，子元素必须自己写 - 表单控件（
input、select、button）在多数浏览器里会忽略父级文字样式，得显式加font-family: inherit等才管用
为什么子元素没继承到 font-size 或 color？
常见原因不是“继承失效”，而是被更高优先级的规则覆盖了。DevTools 里看到 “Inherited from …” 行是灰色的，说明它确实继承了，但后面有更重的声明把它顶掉了。
- 检查子元素是否写了内联
style，比如style="color: #000"—— 行内样式权重 1000，轻松干掉任何继承值 - 看是否有 ID 选择器（如
#header p）或类组合（如.card .title）命中了该元素，权重可能已超过父级规则 - 注意浏览器默认样式表（user agent stylesheet）有时会给
h1～h6、strong等设font-weight: bold，它会覆盖继承来的font-weight: 400
inherit / unset / initial 到底怎么选？
这三个关键字解决的是不同问题，混用容易翻车。
立即学习“前端免费学习笔记（深入）”；
-
inherit：强制拿父级计算后的值，哪怕属性本不继承（比如给div写border: inherit就会报错，因为border不可继承） -
unset：对可继承属性 =inherit，对不可继承属性 =initial；但它不等于“清空”——比如color: unset在父级是蓝色时，子元素还是蓝的 -
initial：一律回浏览器默认值，color: initial会变黑色（不是透明），font-size: initial是 16px（多数浏览器）
真正想“取消继承并恢复默认”，通常要写 color: initial，而不是 unset。
如何让所有子元素统一继承某套文字样式？
最稳的方式是在 :root 或 body 上集中声明，而不是每个容器都重复写。
:root {
font-family: system-ui, -apple-system, sans-serif;
font-size: 16px;
line-height: 1.5;
color: #333;
}
这样所有后代文本元素（p、span、li、button）都会拿到这些值，除非你主动覆盖。但别忘了给表单元素补一句 font: inherit，否则它们大概率会用浏览器默认字体。
继承链越长，中间某一级被覆盖的风险越高；关键样式宁可多写一次 font-size: 1rem，也别依赖五层外的 :root 值。
