Es gibt vier Möglichkeiten, CSS-Stylesheets zu referenzieren. Verwenden Sie CSS-Stile direkt in divs, um div+css-Webseiten zu erstellen, verwenden Sie den in HTML integrierten Stil, verwenden Sie @import, um auf externe CSS-Dateien zu verweisen, und verwenden Sie Links zu Auf externe CSS-Dateien verweisen Jede Methode hat Vor- und Nachteile. Deshalb werden wir heute die Unterschiede zwischen diesen vier Methoden ausführlich erläutern.
Die Verwendung unterschiedlicher Methoden zum Referenzieren von CSS-Stylesheets wird letztendlich den gleichen Effekt erzielen, aber die Verwendung unterschiedlicher Methoden zum Anwenden von CSS-Dateien wirkt sich auf SEO und die Geschwindigkeit und Effizienz beim Öffnen von Webseiten aus. Als Nächstes erklären wir nacheinander die Beispiele für die Referenzierung von CSS in HTML
1. Betten Sie CSS-Stile direkt in HTML-Tag-Elemente ein, z. B.
2. Fügen Sie den Style-Anweisungscode wie folgt in den Kopfteil des HTML-Headers ein:
<style type="text/css">
<!--
.ceshi {font-size:14px; color:#FF0000;}/*这里是设置CSS的样式内容*/
-->
</style>3. Verwenden Sie @import, um auf externe CSS-Dateien zu verweisen
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>css引用方法实例</title> <style type="text/css"> <!-- @import url(wcss.css);/*这里是通过@import引用CSS的样式内容*/ --> </style> </head> <body> <div class="ceshi">我是测试内容</div> </body> </html>
Code in Wcss.css file.ceshi {font-size:14px; color:#FF0000;}
Es ist ersichtlich, dass die Verwendung dieser Methode der Verwendung der integrierten Referenz-CSS-Stylesheet-Methode ähnelt. Beide müssen das Style-Tag im HTML-Kopf verwenden, um auf externes CSS zu verweisen .
4. Verwenden Sie den Link, um eine externe CSS-Datei aufzurufen.
Fügen Sie den Typ So rufen Sie die externe Datei wcss.css auf, um eine HTML-Referenz-CSS-Datei zu implementieren
Diese Methode erfordert kein Style-Tag, sondern verweist direkt auf den externen Stil, indem ein Stil verknüpft wird
Es wird allgemein empfohlen, einen Link zu verwenden, um auf externe Methoden im CSS-Stil zu verweisen.
Vorteile der Verwendung von Links zum Verweisen auf externe CSS-Dateien
1. Durch die Verwendung dieser Methode zum Verweisen auf externe CSS-Dateien wird der Quellcode der HTML-Seite viel kleiner als durch das direkte Hinzufügen CSS-Stile, da Suchmaschinen-Spider beim Crawlen von Webseiten keine CSS-Dateien crawlen, was zu sehr wenigen HTML-Quellcodes führt, wodurch Spider schneller crawlen und weniger verarbeiten, was das Gewicht dieser Webseite erhöht und sich positiv auf das Ranking auswirkt.
2. Durch das Speichern von HTML kann der Browser Threads beim Herunterladen von Webseiten trennen, genau wie das Laden einer Seite und das gleichzeitige Öffnen einer Seite durch zwei Zeilen, wodurch die Webseite besonders schnell geöffnet wird. (Wenn der Benutzer diese Webseite durchsucht, werden gleichzeitig der HTML-Quellcode und die CSS-Datei heruntergeladen, was die Geschwindigkeit beschleunigt.)
3. Es ist praktisch, den Stil der Webseite zu ändern. Sie müssen nur Änderungen vornehmen Der CSS-Stil zum Ändern des Kunststils der Webseite. Da bei dieser Methode des Projekts die gesamte Website einen gemeinsamen CSS-Stil verwendet, ist es schnell und bequem, den Stil der gesamten Website zu ändern.
Dies sind die vier Möglichkeiten, CSS-Stylesheets zu zitieren. Freunde, die sie benötigen, können sie auch weiterhin auf andere Updates auf dieser Website achten.
Verwandte Empfehlungen:
Das obige ist der detaillierte Inhalt vonSo referenzieren Sie CSS in HTML. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
