2017年04月18日    22:12

百度 进入2018年以来，济南空气质量继续延续了良好的改善势头，尤其是2018年2月份，即便在除夕夜这样往年的污染高峰，因为禁放烟花爆竹政策的实施和全市市民共同努力的零燃放，也取得空气质量良好的好成绩。

In CSS kontrolliert Vererbung, was passiert, wenn kein Wert für eine Eigenschaft auf einem Element angegeben ist.

CSS-Eigenschaften k?nnen in zwei Typen kategorisiert werden:

  • Vererbte Eigenschaften, die standardm??ig auf den berechneten Wert des Elternelements gesetzt werden
  • Nicht-vererbte Eigenschaften, die standardm??ig auf den Anfangswert der Eigenschaft gesetzt werden

Sehen Sie sich die Definition einer beliebigen CSS-Eigenschaft an, um zu sehen, ob eine bestimmte Eigenschaft standardm??ig vererbt wird ("Inherited: yes") oder nicht ("Inherited: no").

Vererbte Eigenschaften

Wenn für eine vererbte Eigenschaft kein Wert auf einem Element angegeben wurde, erh?lt das Element den berechneten Wert dieser Eigenschaft von seinem Elternelement. Nur das Root-Element des Dokuments erh?lt den Anfangswert, der in der Zusammenfassung der Eigenschaft angegeben ist.

Ein typisches Beispiel für eine vererbte Eigenschaft ist die color-Eigenschaft. Betrachten Sie die folgenden Stilregeln und das Markup:

css
p {
  color: green;
}
html
<p>This paragraph has <em>emphasized text</em> in it.</p>

Die W?rter "emphasized text" erscheinen grün, da das em-Element den Wert der color-Eigenschaft vom p-Element geerbt hat. Es erh?lt nicht den Anfangswert der Eigenschaft (welcher die Farbe ist, die für das Root-Element verwendet wird, wenn die Seite keine Farbe angibt).

Nicht-vererbte Eigenschaften

Wenn für eine nicht-vererbte Eigenschaft kein Wert auf einem Element angegeben wurde, erh?lt das Element den Anfangswert dieser Eigenschaft (wie in der Zusammenfassung der Eigenschaft angegeben).

Ein typisches Beispiel für eine nicht-vererbte Eigenschaft ist die border-Eigenschaft. Betrachten Sie die folgenden Stilregeln und das Markup:

css
p {
  border: medium solid;
}
html
<p>This paragraph has <em>emphasized text</em> in it.</p>

Die W?rter "emphasized text" werden keinen weiteren Rahmen haben (da der Anfangswert von border-style none ist).

Anmerkungen

Das inherit-Schlüsselwort erm?glicht es Autoren, die Vererbung explizit anzugeben. Es funktioniert sowohl bei vererbten als auch nicht-vererbten Eigenschaften.

Sie k?nnen die Vererbung für alle Eigenschaften auf einmal mit der all-Kurznotation steuern, die ihren Wert auf alle Eigenschaften anwendet. Zum Beispiel:

css
p {
  all: revert;
  font-size: 200%;
  font-weight: bold;
}

Dies setzt den Stil der Abs?tze' font-Eigenschaft auf den Standard des User-Agents zurück, es sei denn, es existiert ein Benutzerstylesheet, in diesem Fall wird dies stattdessen verwendet. Dann wird die Schriftgr??e verdoppelt und ein font-weight von "bold" angewendet.

überschreiben der Vererbung, ein Beispiel

Wenn wir das vorherige Beispiel mit border verwenden und die Vererbung mit inherit explizit festlegen, erhalten wir folgendes:

css
p {
  border: medium solid;
}

em {
  border: inherit;
}
html
<p>This paragraph has <em>emphasized text</em> in it.</p>

Wir k?nnen hier einen weiteren Rahmen um das Wort "emphasized text" sehen.

Spezifikationen

Specification
CSS Cascading and Inheritance Level 5
# css-inheritance

Siehe auch