CSS Akronym von “Cascading Style Sheet”Ist eine Designsprache, die definiert, wie man eine auffällige Webseite entwirft. Es beschreibt das Aussehen und die Formatierung einer Site, die in einer Markup -Sprache erstellt wurde. Normalerweise wird CSS zusammen mit HTML verwendet, um die Stile von Websites und Benutzeroberflächen festzulegen.

Cascading Style Sheet

Kaskadierung bedeutet schauen, Stil bedeutet Design auf HTML -Element/ Hinzufügen von Stil zu Webdokumenten und Blatt bedeutet Seite e.G. Webseitendokument.

Arten von CSS

CSS kann auf drei Arten verwendet werden:

• Inline CSS: Der Inline CSS implementiert den Stil in einer Zeile.
• Interne CSS: Der Interne CSS Wenden Sie einen bestimmten Stil auf einer einzelnen Seite an.
• Externes CSS: Der externes CSS ist eine separate Datei und kann von mehreren HTML -Dokumenten/Seiten verwendet werden.

Importieren Sie zu diesem Zweck einfach den externen Link der CSS -Datei in den Kopfabschnitt.

CSS -Syntax

Schauen wir uns das folgende CSS -Styling an, um die CSS -Syntax besser zu verstehen:

Im oben gegebenen Snippet ist P ein Selektor, der auf ein HTML-Element verweist, das Sie stylen möchten. Während „Background-Color“ eine Eigenschaft ist und „Gold“ ihr Wert ist.

In ähnlicher Weise sind „Schriftgrößen“ und „Text-Align“ Eigenschaften, während „Medium“ und „Recht“ Werte dieser Eigenschaften sind.

Beispiel 1: Dieses Beispiel bietet Ihnen eine eingehende Ansicht darüber, wie Inline-CSS funktioniert:

Willkommen bei LinuxHint.com

Die beste Website, um hochwertige Artikel zu lesen

Das obige Skript implementierte einen Stil zum ersten Mal

Element mit Inline -CSS. Es wird die folgende Ausgabe angezeigt:

In diesem Beispiel haben wir nur zwei

Elemente und wir müssen den Stil nur auf einem Element implementieren, also haben wir das Inline -CSS verwendet. Wenn wir also ein paar HTML -Elemente stylen müssen, können wir für jedes Element Inline -CSS verwenden.

Aber was ist, wenn wir Hunderte von HTML -Elementen auf einer Seite e haben.G. Wir haben hundert

Wenn wir also einen einzigartigen Stil auf der gesamten Seite implementieren müssen, werden wir das interne CSS verwenden.

Beispiel-2: Das folgende Beispiel implementiert die gleiche Hintergrundfarbe, Textfarbe für den gesamten Körper des HTML -Dokuments:

Willkommen bei LinuxHint.com

Die beste Website, um hochwertige Artikel zu lesen

Der obige Snippet liefert die folgende Ausgabe:

Was ist, wenn wir mehr als ein Seiten stylen müssen?? In solchen Fällen werden das externe CSS implementiert. Nur eine einzige Datei kann das gesamte Erscheinungsbild der Website ändern. Daher wird empfohlen, immer externe CSS zu verwenden.

Wenn Sie mit externen CSS arbeiten, müssen Sie die bestimmen müssen im Abschnitt.

Beispiel-3: Dieses Beispiel erstellt eine CSS -Datei, um den Stil zu definieren. Der Link zu dieser Datei wird im Kopfabschnitt bereitgestellt. Sowohl die HTML- als auch die CSS-Dateien werden zu einem Verschluss verabreicht:

Extern.html

Willkommen bei LinuxHint.com

Die beste Website, um hochwertige Artikel zu lesen

Extern.CSS

Körper
Hintergrundfarbe: Brown;
Farbe: Goldenrod;
Schriftstil: kursiv;

H1
Farbe: Schwarz;
Text-Align: Mitte;

Die Ausgabe überprüfen, dass die externe CSS -Datei ordnungsgemäß mit der HTML -Datei verknüpft ist:

Cascade -Stilauftrag

Jetzt haben Sie möglicherweise eine Frage? Was ist, wenn wir Inline-, interne und externe CSS -Stile auf einer Webseite verwenden? Welche von ihnen wird dann implementiert? Welcher Stil hat maximale Vorrang?

Also! Wenn in der Erklärung im CSS -Stil einen Konflikt vorhanden ist, überschreiben INline -CSS interne CSS, was wiederum die externen CSS überschreibt. Dies bedeutet. Die Browser -Standardstile haben den niedrigsten Vorrang.

Wenn die verschiedenen CSS -Stile auf derselben Vorrangniveau bestimmt werden, hat der Stil, der dem gezielten Element am nächsten liegt.

Beispiel-4: Betrachten wir das folgende Beispiel, das die Mehrfachstile bestimmt:

Extern.CSS -Datei

Körper
Hintergrundfarbe: Brown;
Farbe: Goldenrod;
Schriftstil: kursiv;

Vorrang.HTML -Datei

Willkommen bei LinuxHint.com

Die beste Website, um hochwertige Artikel zu lesen

Der obige Code ermittelt drei Stile, in der die Ausgabe überprüft, dass das Inline -CSS höchste Vorrang hat:

Vorteile

1. Es spart viel Zeit, während wir eine Webseite entwickeln, da wir in mehreren HTML -Dateien eine CSS -Datei verwenden können. Zum Beispiel haben wir mehrere HTML -Dateien, dann müssen wir uns mit ihrem Aussehen, Stil usw. befassen. Anstatt den Stil in jeder HTML -Datei separat zu implementieren, ist es besser, die CSS -Datei in jedem HTML -Dokument zu importieren, das Sie stylen möchten.
2. Webseiten laden schnell, da CSS HTML -Attribute nicht immer wieder verwendet und wiederum nur eine CSS -Regel für ein Tag erstellt und alle seine Vorkommen in der HTML -Datei implementiert werden.
3. CSS bietet eine einfache Wartung, da wir es in einer einzelnen Datei verarbeiten können. Angenommen, wir haben zehn Absätze in einem Dokument und möchten ihren Stil ändern. Anstatt es zehnmal zu machen, können wir es einmal in der CSS -Datei tun und es wird auf alle zehn Vorkommen der Angewandt angewendet

   Element.

4. CSS bietet Kompatibilität. Dies bedeutet, dass es mit mehreren Geräten kompatibel ist.

Abschluss

CSS ist eine Designsprache, die attraktive Webseiten erstellt. Es wird zum Erstellen von Stilen und zum Anpassen von HTML -Elementen verwendet, die auf einer Webseite verfügbar sind. Es verbessert die Site -Geschwindigkeit und bietet eine einfache Anpassung jeder Webseite.

In diesem Beitrag erfahren Sie, was CSS ist, wie CSS verwendet werden und wie wichtig die wichtigsten Vorteile von CSS sind. Darüber hinaus erfahren Sie mehr über die Vorrangreihenfolge der Kaskadenstile.