Heim >Web-Frontend >HTML-Tutorial >So fügen Sie CSS zu HTML hinzu
Es gibt vier Hauptmethoden zum Hinzufügen von CSS in HTML: Inline, eingebettet, verlinkt und importiert.
1. Inline
Inline dient zum Festlegen des CSS-Stils im Stilattribut des Tags . Diese Methode spiegelt nicht die Vorteile von CSS wider und wird nicht empfohlen.
<div style = "width:100px;height:100px;>我是行内样式</div>
2. Eingebettet
Eingebettet ist das Schreiben von CSS-Stilen in das
Das Format lautet wie folgt:<head> <style type="text/css"> ...此处写CSS样式 </style> </head>
Der Nachteil besteht darin, dass es bei einer Website, die viele Webseiten enthält, sehr mühsam ist, die Einbettung in jede Webseite zu verwenden und den Stil zu ändern. Einzelne Webseiten können die Verwendung von Einbettungen in Betracht ziehen.
3. Der Importtyp
führt eine unabhängige CSS-Datei in die HTML-Datei ein. Der Importtyp verwendet CSS-Regeln, um externe CSS-Dateien einzuführen,
rrreeImport lädt die CSS-Datei, nachdem die gesamte Webseite geladen wurde. Dies führt also zu einem Problem. Wenn die Webseite relativ groß ist, wird zuerst eine nicht gestylte Seite und nach einem Blitz der Stil der Webseite angezeigt wird erscheinen. Dies ist ein inhärenter Importfehler.
4. Der Linktyp
führt ebenfalls eine .css-Datei in die HTML-Datei ein, unterscheidet sich jedoch vom Importtyp darin, dass der Linktyp HTML-Regeln verwendet Zum Einführen einer externen CSS-Datei werden Tags im Tag-Paar der Webseite verwendet, um externe Stylesheet-Dateien einzuführen. Die Syntax lautet wie folgt:
<style type="text/css"> @import"mystyle.css"; //此处要注意.css文件的路径 </style>
Bei Verwendung des Linktyps unterscheidet er sich vom Importtyp Dadurch wird die CSS-Datei vor dem Laden des Hauptteils der Webseitendatei geladen, sodass die angezeigte Webseite nicht zuerst die nicht gestaltete Webseite und dann die gestaltete Webseite anzeigt der Importtyp. Dies ist der Vorteil des Linktyps.
Zusammenfassung: Im Allgemeinen werden Stile beim Erstellen einer Website meist in mehreren Stylesheet-Dateien geschrieben. Daher verwenden wir zunächst einen Link, um eine allgemeine CSS-Datei einzuführen, und dann in diesem CSS Importe werden in der Datei verwendet, um andere CSS-Dateien einzuführen. Wenn Sie CSS-Dateien jedoch dynamisch über JavaScript einführen, können Sie nur die Verknüpfung verwenden.
Das obige ist der detaillierte Inhalt vonSo fügen Sie CSS zu HTML hinzu. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!