CSS中默认可继承的属性包括color、font-family、font-size、font-weight、font-style、line-height、text-align、text-indent、letter-spacing、visibility、cursor、list-style-type、quotes等，主要集中在文本、字体、列表和部分交互表现；text-shadow、background-color、border、display、padding、margin等明确不可继承。
可继承属性不是“写了就能传下去”，而是由每个 CSS 属性自身定义决定的；inherit 能绕过默认规则强制取父级计算值，但对不支持继承的属性（比如 margin）写 inherit 也不会报错——只是它会向上找，直到根元素，再 fallback 到初始值。
哪些 CSS 属性默认会继承？
继承只发生在特定属性上，集中在文本、字体、列表和部分交互表现。常见高频可继承属性包括：
-
color、font-family、font-size、font-weight、font-style -
line-height、text-align、text-indent、letter-spacing -
visibility、cursor、list-style-type、quotes
注意：text-shadow、background-color、border、display、padding、margin 这些明确不可继承。哪怕你在父元素写 display: flex，子元素仍是 display: inline（或浏览器默认值）。
为什么 DevTools 显示 “Inherited from …” 却没生效？
这不是继承失效，而是被更高优先级规则覆盖了。DevTools 中灰色的 “Inherited from” 表示它确实继承了，但后面有更重的声明把它顶掉了：
立即学习“前端免费学习笔记（深入）”；
- 检查子元素是否有内联样式，例如
style="color: #000"—— 权重 1000，轻松压过继承值 - 看是否命中了 ID 选择器（如
#header p）或高权重类组合（如.card .title） - 别忽略浏览器默认样式：
strong默认带font-weight: bold，会覆盖你从父级继承来的font-weight: 400
inherit 怎么用？它和 unset/initial 有什么区别？
inherit 是显式指令：“取父元素该属性的**计算值**”。它不关心该属性本是否可继承，只要父元素有值，就拿过来用：
.parent { background-color: rgba(255, 192, 203, 0.8); }
.child { background-color: inherit; } /* .child 得到的就是那个 RGBA 值 */三个关键字行为差异明显：
-
inherit：强制取父元素计算值，哪怕该属性默认不可继承（border: inherit合法） -
unset：对可继承属性 =inherit，对不可继承属性 =initial；但它不等于“清空”，例如父级color: blue，子元素写color: unset，结果还是蓝色 -
initial：一律回浏览器默认值 ——color: initial是黑色，font-size: initial是 16px（多数浏览器）
真正想“取消继承并恢复默认”，通常要写 color: initial，而不是 unset。
表单控件和伪元素是继承的例外区域
input、select、button 等原生表单控件在多数浏览器里会忽略父级文字样式，必须显式加 font-family: inherit、font-size: inherit 才能透传；::before、::after 伪元素虽是后代，但继承行为受限：content 不继承，color 可继承，margin 不继承 —— 这些边界点最容易漏查。
