suchen

Heim >Web-Frontend >Front-End-Fragen und Antworten >So referenzieren Sie CSS

So referenzieren Sie CSS

PHPz
PHPzOriginal
2023-05-14 20:25:06978Durchsuche

Bei der Webseitenproduktion ist CSS (Cascading Style Sheets) eine Sprache, die zur Steuerung des Stils und Layouts von Webseiten verwendet wird. Sie kann die Verschönerung und Kompatibilität von Webseiten realisieren, was die Front-End-Entwicklungsarbeit erheblich erleichtert. In diesem Artikel erfahren Sie, wie Sie auf CSS verweisen.

1. Internes Stylesheet

Das interne Stylesheet bettet das CSS-Stylesheet in das HTML-Dokument ein. Mithilfe eines internen Stylesheets müssen wir ein c9ccee2e6ea535a969eb3f532ad9fe89-Tag im 93f0f5c25f18dab9d176bd4f6de5d30e-Tag erstellen und den CSS-Code wie folgt darin schreiben: 

<head>
   <style>
       h1 {
           color: red;
           font-size: 36px;
       }
   </style>
</head>

Auf diese Weise wird der Text des Das h1-Element wird als Farbe auf Rot und die Schriftgröße auf 36 Pixel eingestellt. Es ist zu beachten, dass diese Methode nur für die aktuelle Seite verwendet werden kann und nicht für mehrere Seiten mit demselben Stil geeignet ist.

2. Externes Stylesheet

Ein externes Stylesheet speichert das CSS-Stylesheet in einer separaten Datei und verweist dann auf die Datei im HTML-Dokument. Um ein externes Stylesheet zu verwenden, müssen wir ein 2cdf5bf648cf2f33323966d7f58a7f3f-Tag im 93f0f5c25f18dab9d176bd4f6de5d30e-Tag hinzufügen und den Pfad zur CSS-Datei in ihrem href-Attribut wie folgt angeben: 

<head>
   <link rel="stylesheet" href="styles.css">
</head>

in Styles .css In die Datei können wir die CSS-Stile schreiben, die alle Seiten verwenden müssen, zum Beispiel: 

h1 {
   color: red;
   font-size: 36px;
}

Auf diese Weise wird der h1-Elementtext auf allen Seiten festgelegt, die auf „styles.css“ verweisen auf Rot und die Schriftgröße beträgt 36 Pixel.

3. Inline-Stylesheet

Inline-Stylesheet definiert den CSS-Stil als Attribut des Elements. Mithilfe eines Inline-Stylesheets verwenden wir das Style-Attribut direkt im HTML-Tag, wie unten gezeigt: 

<h1 style="color: red; font-size: 36px;">Hello World!</h1>

Auf diese Weise wird die Textfarbe des h1-Elements auf Rot und die Schriftgröße auf Rot gesetzt 36 Pixel. Es ist zu beachten, dass eine übermäßige Verwendung von Inline-Stylesheets vermieden werden sollte, da diese umständlich zu verwalten sind und sich nicht dazu eignen, denselben CSS-Stil für mehrere Elemente zu verwenden.

Zusammenfassung:

Für die oben genannten drei Methoden eignen sich interne Stylesheets für Stile, die von einer einzelnen Seite verwendet werden, externe Stylesheets eignen sich für Stile, die von mehreren Seiten gemeinsam genutzt werden, und Inline-Stylesheets Es eignet sich für personalisierte Stileinstellungen. Durch den kompetenten Einsatz dieser Methoden kann die Frontend-Entwicklungsarbeit effizienter und standardisierter gestaltet werden.

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

Stellungnahme：
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
Vorheriger Artikel：So verbinden Sie CSS-DateienNächster Artikel：So verbinden Sie CSS-Dateien

In Verbindung stehende Artikel

Mehr sehen