Heim > Web-Frontend > CSS-Tutorial > Hat CSS eine Vererbungsbeziehung?

Hat CSS eine Vererbungsbeziehung?

青灯夜游
Freigeben: 2022-12-30 11:12:13
Original
3371 Leute haben es durchsucht

CSS hat eine Vererbungsbeziehung. Bei der CSS-Vererbung handelt es sich um eine Regel, die es ermöglicht, Stile nicht nur auf ein bestimmtes HTML-Tag-Element anzuwenden, sondern auch auf dessen Nachkommen: Wenn der CSS-Stil des übergeordneten (übergeordneten) Elements festgelegt ist, werden die untergeordneten Elemente des übergeordneten (übergeordneten) Elements festgelegt. und darunter Alle Ebenen (Untergebenen) haben diesen Stil.

Hat CSS eine Vererbungsbeziehung?

Die Betriebsumgebung dieses Tutorials: Windows 7-System, CSS3-Version, Dell G3-Computer.

(Teilen von Lernvideos: CSS-Video-Tutorial)

CSS hat eine Vererbungsbeziehung. Die Rolle der CSS-Vererbung: Legen Sie einige Attribute für übergeordnete Elemente fest, die auch von untergeordneten Elementen verwendet werden können.

CSS-Vererbung bedeutet, dass die darin eingeschlossenen Tags die Stileigenschaften der äußeren Tags haben. Die typischste Anwendung der Vererbungsfunktion ist normalerweise die Verwendung im Stilstandard der gesamten Webseite, und die Teile, die als andere Stile bezeichnet werden müssen, können in einzelnen Elementen festgelegt werden. Diese Funktion kann Webdesignern mehr Spielraum bieten. Gleichzeitig gibt es aber auch viele Regeln für die Vererbung, deren Anwendung verwirrend sein kann. Eines der Hauptmerkmale von CSS ist die Vererbung, die auf der Beziehung zwischen Vorfahren und Nachkommen beruht. Vererbung ist ein Mechanismus, der es ermöglicht, Stile nicht nur auf ein bestimmtes Element, sondern auch auf seine Nachkommen anzuwenden. Beispielsweise wird ein durch BODY definierter Farbwert auch auf den Text des Absatzes angewendet. Das Folgende ist ein Beispiel:

Stildefinition:

body{color:red;}
Nach dem Login kopieren

Anwendungsbeispielcode:

<p>CSS的<strong>层叠和继承</strong>深入探讨</p>
Nach dem Login kopieren

Das Anwendungsergebnis dieses Codes lautet: „Ausführliche Diskussion der CSS-Kaskadierung und -Vererbung“ Dieser Absatz ist rot, weil „Kaskadierung und Vererbung" Das starke Element wird angewendet, daher ist es fett. Dies entspricht der Absicht des Autors und ist der Grund, warum Vererbung Teil von CSS ist.

Hinweis:

1. Es können nur Attribute vererbt werden, die mit Farbe/Schriftart/Text/Zeile beginnen.

2 kann erben

Anwendungsszenario:

wird im Allgemeinen zum Festlegen allgemeiner Informationen auf Webseiten verwendet, z. B. Textfarbe, Schriftart, Textgröße usw.

CSS verfügt über geerbte Eigenschaften

1. Text Serienattribute

text-indent: Texteinzug

text-align: horizontale Textausrichtung

line-height: Zeilenhöhe

word-spacing: Abstand zwischen Wörtern vergrößern oder verkleinern (d. h. Wortabstand)

letter -spacing: den Abstand zwischen den Zeichen vergrößern oder verkleinern (Zeichenabstand)

Texttransformation: Groß-/Kleinschreibung des Textes steuern

Richtung: Schreibrichtung des Textes festlegen

Farbe: Textfarbe

2. Attribute der Schriftfamilie

Schriftart: Kombinierte Schriftart

font-family: Geben Sie die Schriftfamilie des Elements an

font-weight: Legen Sie die Dicke der Schriftart fest

font-size: Legen Sie die Größe der Schriftart fest

font-style: Definieren Sie den Stil der Schriftart

Schriftartvariante: Legt die Kapitälchen-Schriftart für die Textanzeige fest, d. h. alle Kleinbuchstaben werden in Großbuchstaben umgewandelt, aber alle Buchstaben mit Kapitälchen haben im Vergleich zum Rest des Textes eine kleinere Schriftgröße.

font-stretch: Dehnen und transformieren Sie die aktuelle Schriftfamilie. Wird nicht von allen gängigen Browsern unterstützt.

font-size-adjust: Geben Sie einen Aspektwert für ein Element an, damit die x-Höhe der bevorzugten Schriftart beibehalten wird.

3. Tabellenlayoutattribute

caption-side: Legen Sie die Position des Tabellentitels fest.

border-collapse: Legen Sie fest, ob die Tabellenränder zu einem einzigen Rahmen zusammengeführt oder wie in Standard-HTML separat angezeigt werden sollen.

Randabstand: Legen Sie den Abstand zwischen den Rändern benachbarter Zellen fest (wird nur im Modus „Randtrennung“ verwendet).

empty-cells: Legen Sie fest, ob leere Zellen in der Tabelle angezeigt werden sollen (nur für den Modus „abgelöster Rand“).

table-layout: Legen Sie den Tabellenlayout-Algorithmus für die Tabelle fest.

4. Listenlayoutattribute:

list-style-type: Legen Sie den Typ der Listenelementmarkierung fest.

list-style-image: Verwenden Sie ein Bild, um das Markup eines Listenelements zu ersetzen.

list-style-position: Gibt an, wie Listenelementmarkierungen relativ zum Inhalt des Objekts gezeichnet werden.

list-style: Kurzform-Eigenschaft zum Festlegen aller Listeneigenschaften in einer Deklaration.

5. Elementsichtbarkeit: Sichtbarkeit

6. Attribute des generierten Inhalts: Anführungszeichen

8. Seitenstilattribute:

Seite, Seitenumbruch, Fenster , Waisen

9, Klangstilattribute:

Speak, Speak-Interpunktion, Speak-Numeral, Speak-Header, Sprechgeschwindigkeit, Lautstärke, Stimmfamilie, Tonhöhe, Tonhöhenbereich, Betonung, Fülle, Azimut , Elevation

Weitere Kenntnisse zum Thema Programmierung finden Sie unter: Einführung in die Programmierung! !

Das obige ist der detaillierte Inhalt vonHat CSS eine Vererbungsbeziehung?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage