mdn · Dr-XYZ · Jul 8, 2025 · Jul 8, 2025 · Jul 8, 2025 · Jul 9, 2025
@@ -1,78 +1,114 @@
 ---
 title: 繼承
 slug: Web/CSS/CSS_cascade/Inheritance
+l10n:
+  sourceCommit: 1b88b4d62918f6f13d1155825e3881f52d90206e
 ---
 
 {{CSSRef}}
 
-每個 [CSS property definition](/zh-TW/docs/Web/CSS/Reference) 都寫道是否這個屬性預設有繼承: ("Inherited: Yes") 或是 預設沒有繼承: ("Inherited: no"). 這個設定將會在沒有位屬性標註值時發生.
+在 CSS 中，**繼承**控制了當元素上的屬性未指定值時會發生什麼事。
+
+CSS 屬性可以分為兩種類型：
+
+- **繼承屬性**，預設會設定為其父元素的[計算值](/zh-TW/docs/Web/CSS/CSS_cascade/Value_processing#計算值)。
+- **非繼承屬性**，預設會設定為該屬性的[初始值](/zh-TW/docs/Web/CSS/CSS_cascade/Value_processing#初始值)。
+
+請參閱[任何 CSS 屬性](/zh-TW/docs/Web/CSS/Reference#索引)的定義，以查看特定屬性預設是否繼承（「Inherited: yes」）或不繼承（「Inherited: no」）。
 
 ## 繼承屬性
 
-When no value for an **inherited property** has been specified on an element, the element gets the [computed value](/zh-TW/docs/Web/CSS/CSS_cascade/computed_value) of that property on its parent element. Only the root element of the document gets the [initial value](/zh-TW/docs/Web/CSS/CSS_cascade/initial_value) given in the property's summary.
+當元素上未指定**繼承屬性**的值時，該元素會取得其父元素上該屬性的[計算值](/zh-TW/docs/Web/CSS/CSS_cascade/Value_processing#計算值)。只有文件的根元素會取得屬性摘要中給定的[初始值](/zh-TW/docs/Web/CSS/CSS_cascade/Value_processing#初始值)。
 
-A typical example of an inherited property is the {{ Cssxref("color") }} property. Given the style rules:
+繼承屬性的一個典型範例是 [`color`](/zh-TW/docs/Web/CSS/color) 屬性。請看以下樣式規則和標記：
 
 ```css
 p {
   color: green;
 }
 ```
 
-HTML:
-
 ```html
-<p>This paragraph has <em>emphasized text</em> in it.</p>
+<p>這個段落裡有<em>強調文字</em>。</p>
 ```
 
-the words "emphasized text" will appear green, since the `em` element has inherited the value of the {{ Cssxref("color") }} property from the `p` element. It does _not_ get the initial value of the property (which is the color that is used for the root element when the page specifies no color).
+{{EmbedLiveSample("繼承屬性","",40)}}
+
+「強調文字」這幾個字會顯示為綠色，因為 `em` 元素從 `p` 元素繼承了 [`color`](/zh-TW/docs/Web/CSS/color) 屬性的值。它*不會*取得該屬性的初始值（也就是當頁面未指定顏色時，根元素所使用的顏色）。
 
 ## 非繼承屬性
 
-When no value for an **non-inherited property** (sometimes called a **reset property** in Mozilla code) has been specified on an element, the element gets the [initial value](/zh-TW/docs/Web/CSS/CSS_cascade/initial_value) of that property (as specified in the property's summary).
+當元素上未指定**非繼承屬性**的值時，該元素會取得該屬性的[初始值](/zh-TW/docs/Web/CSS/CSS_cascade/Value_processing#初始值)（如屬性摘要中所指定）。
 
-A typical example of a non-inherited property is the {{ Cssxref("border") }} property. Given the style rules:
+非繼承屬性的一個典型範例是 {{ Cssxref("border") }} 屬性。請看以下樣式規則和標記：
 
 ```css
 p {
   border: medium solid;
 }
 ```
 
-HTML:
+```html
+<p>這個段落裡有<em>強調文字</em>。</p>
+```
+
+{{EmbedLiveSample("非繼承屬性","",40)}}
+
+「強調文字」這幾個字不會有另一個邊框（因為 [`border-style`](/zh-TW/docs/Web/CSS/border-style) 的初始值是 `none`）。
+
+## 備註
+
+[`inherit`](/zh-TW/docs/Web/CSS/inherit) 關鍵字允許作者明確指定繼承。它對繼承和非繼承屬性都有效。
+
+你可以使用 [`all`](/zh-TW/docs/Web/CSS/all) 簡寫屬性一次控制所有屬性的繼承，它會將其值應用於所有屬性。例如：
+
+```css
+p {
+  all: revert;
+  font-size: 200%;
+  font-weight: bold;
+}
+```
+
+這會將段落的 [`font`](/zh-TW/docs/Web/CSS/font) 屬性樣式還原為使用者代理程式的預設值，除非存在使用者樣式表，在這種情況下會改用使用者樣式表。然後它會將字體大小加倍，並應用 `"bold"` 的 [`font-weight`](/zh-TW/docs/Web/CSS/font-weight)。
+
+### 覆寫繼承範例
+
+使用我們先前關於 [`border`](/zh-TW/docs/Web/CSS/border) 的範例，如果我們用 `inherit` 明確設定繼承，我們會得到以下結果：
+
+```css
+p {
+  border: medium solid;
+}
+
+em {
+  border: inherit;
+}
+```
 
 ```html
-<p>This paragraph has <em>emphasized text</em> in it.</p>
+<p>這個段落裡有<em>強調文字</em>。</p>
 ```
 
-the words "emphasized text" will not have a border (since the initial value of {{ Cssxref("border-style") }} is `none`).
+{{EmbedLiveSample("覆寫繼承範例","",40)}}
+
+我們可以在這裡看到「強調文字」這個詞周圍有另一個邊框。
 
-## 註
+## 規範
 
-{{ Cssxref("inherit") }} 關鍵字允許作者準確地去標註. 這個在繼承和非繼承屬性都是有效的.
+{{Specifications}}
 
 ## 參見
 
-- [CSS Reference](/zh-TW/docs/Web/CSS/Reference)
-- CSS 重要概念：
-  - [CSS 語法](/zh-TW/docs/Web/CSS/CSS_syntax/Syntax)
-  - [@ 規則](/zh-TW/docs/Web/CSS/CSS_syntax/At-rule)
-  - [註釋](/zh-TW/docs/Web/CSS/CSS_syntax/Comments)
-  - [優先級](/zh-TW/docs/Web/CSS/Specificity)
-  - [盒模型](/zh-TW/docs/Web/CSS/CSS_box_model/Introduction_to_the_CSS_box_model)
-  - [佈局模式](/zh-TW/docs/Web/CSS/Layout_mode)
-  - [視覺格式化模型](/zh-TW/docs/Web/CSS/Visual_formatting_model)
-  - [外邊距合併](/zh-TW/docs/Web/CSS/CSS_box_model/Mastering_margin_collapsing)
-  - 值
-    - [初始值](/zh-TW/docs/Web/CSS/CSS_cascade/initial_value)
-    - [計算值](/zh-TW/docs/Web/CSS/CSS_cascade/computed_value)
-    - [解析值](/zh-TW/docs/Web/CSS/resolved_value)
-    - [指定值](/zh-TW/docs/Web/CSS/CSS_cascade/specified_value)
-    - [應用值](/zh-TW/docs/Web/CSS/CSS_cascade/used_value)
-    - [實際值](/zh-TW/docs/Web/CSS/CSS_cascade/actual_value)
-
-  - [特性值定義語法](/zh-TW/docs/Web/CSS/CSS_Values_and_Units/Value_definition_syntax)
-  - [簡寫屬性](/zh-TW/docs/Web/CSS/CSS_cascade/Shorthand_properties)
-  - {{glossary("replaced elements", "可置換元素")}}
-
-- {{ Cssxref("inherit") }}
+- 用於控制繼承的 CSS 值：[`inherit`](/zh-TW/docs/Web/CSS/inherit)、[`initial`](/zh-TW/docs/Web/CSS/initial)、[`revert`](/zh-TW/docs/Web/CSS/revert)、[`revert-layer`](/zh-TW/docs/Web/CSS/revert-layer) 和 [`unset`](/zh-TW/docs/Web/CSS/unset)
+- [CSS 錯誤處理](/zh-TW/docs/Web/CSS/CSS_syntax/Error_handling)
+- [CSS 層疊介紹](/zh-TW/docs/Web/CSS/CSS_cascade/Cascade)
+- [學習：處理衝突](/zh-TW/docs/Learn_web_development/Core/Styling_basics/Handling_conflicts)
+- [學習：層疊層](/zh-TW/docs/Learn_web_development/Core/Styling_basics/Cascade_layers)
+- [CSS 層疊與繼承](/zh-TW/docs/Web/CSS/CSS_cascade)模組
+- [CSS 語法](/zh-TW/docs/Web/CSS/CSS_syntax/Syntax)指南
+- [CSS 語法](/zh-TW/docs/Web/CSS/CSS_syntax)模組
+- [At 規則](/zh-TW/docs/Web/CSS/CSS_syntax/At-rule)
+- [初始](/zh-TW/docs/Web/CSS/CSS_cascade/Value_processing#初始值)、[計算](/zh-TW/docs/Web/CSS/CSS_cascade/Value_processing#計算值)、[應用](/zh-TW/docs/Web/CSS/CSS_cascade/Value_processing#應用值)和[實際](/zh-TW/docs/Web/CSS/CSS_cascade/Value_processing#實際值)值
+- [值定義語法](/zh-TW/docs/Web/CSS/CSS_Values_and_Units/Value_definition_syntax)
+- [CSS 巢狀模組](/zh-TW/docs/Web/CSS/CSS_nesting)