Heim > Artikel > Entwicklungswerkzeuge > Wie verknüpft Webstorm CSS mit HTML?
Es gibt drei Möglichkeiten, CSS mit HTML zu verknüpfen: Inline-Stile (direkt im HTML geschrieben), interne Stylesheets (im HTML-Dokument erstellt) oder externe Stylesheets (in einer separaten CSS-Datei gespeichert und in HTML referenziert). Es wird empfohlen, zunächst externe Stylesheets zu verwenden, um die Wiederverwendbarkeit, Wartbarkeit und Ladegeschwindigkeit des Stils zu verbessern. So verknüpfen Sie CSS mit HTML . Internes Stylesheet
Erstellen Sie ein <style>
-Element im Abschnitt <head>
und fügen Sie die CSS-Regeln darin ein:
<code class="html"><p style="color: red;">我的文本</p></code>
3. Externe Stylesheets
speichern CSS-Regeln in einer separaten CSS-Datei und verweisen dann auf die Datei im HTML-Dokument mit dem Tag<link>
:
<code class="html"><head> <style> p { color: red; } </style> </head></code>
Vorteile der Verwendung von extern Stylesheets:
Wiederverwendbarkeit von Styles:Kann auf mehrere HTML-Seiten gleichzeitig angewendet werden.
Einfache Wartung:Aktualisieren Sie einfach eine CSS-Datei, um den Stil auf allen Seiten zu ändern. <head>
部分中创建 <style>
元素,并将 CSS 规则包含在其中:
<code class="html"><head> <link rel="stylesheet" href="mystyle.css"> </head></code>
3. 外部样式表
将 CSS 规则存储在单独的 .css 文件中,然后使用 <link>
Ladegeschwindigkeit verbessern: CSS-Dateien können zwischengespeichert werden, was zu einem schnelleren Laden der Seite führt.
Das obige ist der detaillierte Inhalt vonWie verknüpft Webstorm CSS mit HTML?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!