Erfahren Sie, wie Sie CSS aufrufen

In der Frontend-Entwicklung ist CSS ein unverzichtbarer Bestandteil. CSS kann uns helfen, Stile zu Webseiten hinzuzufügen, unsere Seiten schöner zu machen und Webseiten professioneller und für Benutzer leichter zugänglich zu machen. In diesem Artikel erfahren Sie, wie Sie CSS aufrufen.

1. Inline-Stil

CSS kann im -Tag geschrieben werden. Inline-Stile eignen sich zur Gestaltung einzelner Elemente und haben höchste Priorität.

// HTML-Code Dies ist ein div-Element

# 🎜 🎜#Im obigen Beispiel verwenden wir Inline-Stile, um die Hintergrundfarbe des Div auf Rot und die Textfarbe auf Weiß festzulegen. Dabei ist zu beachten, dass möglichst wenig Inline-Styles verwendet werden sollten, da sonst der HTML-Code langwierig und schwer wartbar wird.

2. Eingebetteter Stil

CSS kann auch in das -Tag geschrieben werden. Inline-Stile eignen sich zum Stylen mehrerer Elemente und haben eine mittlere Priorität.

//HTML-Code

div { background-color: blue; color: white; } p { font-size: 14px; } Nach dem Login kopieren

这是一个 div 元素 这是一个 p 元素

Nach dem Login kopieren Nach dem Login kopieren #🎜🎜 # Im obigen Beispiel verwenden wir eingebettete Stile, um die Hintergrundfarbe des Div auf Blau und die Textfarbe auf Weiß zu setzen, während wir die Schriftgröße von p festlegen 14px. Es ist zu beachten, dass eingebettete Stile nicht extern referenziert werden können und daher für eine einheitliche Verwaltung nicht geeignet sind.

3. Externes Stylesheet

Der beste Weg ist, das CSS in ein externes Stylesheet zu schreiben und dann über einen separaten Link auf das externe Stylesheet zu verweisen. Dadurch wird nicht nur der HTML-Code prägnanter, sondern auch eine einheitliche Verwaltung der Stile wird verbessert.

//HTML-Code

Nach dem Login kopieren

这是一个 div 元素 这是一个 p 元素

Nach dem Login kopieren Nach dem Login kopieren #🎜🎜 # // style.css code div {

background-color: green; color: white; Nach dem Login kopieren } p {

font-size: 16px; Nach dem Login kopieren #🎜🎜 #} Im obigen Beispiel haben wir das CSS in eine separate style.css-Datei geschrieben und es dann über einen Link mit dem HTML-Dokument verknüpft. Zu beachten ist, dass sich externe Stylesheets zur Gestaltung der gesamten Website eignen und von mehreren HTML-Dokumenten gemeinsam genutzt werden können.

Zusammenfassung

Ob es sich um einen Inline-Stil, einen eingebetteten Stil oder ein externes Stylesheet handelt, wir können CSS-Stile über sie aufrufen. Wir sollten jedoch je nach tatsächlicher Situation unterschiedliche Methoden wählen.

Inline-Stile eignen sich zum Gestalten einzelner Elemente; eingebettete Stile eignen sich zum Gestalten mehrerer Elemente; externe Stylesheets eignen sich zum Gestalten der gesamten Website und können für die gemeinsame Nutzung mehrerer HTML-Dokumente verwendet werden.