Heim >Web-Frontend >HTML-Tutorial >So fügen Sie CSS zu HTML hinzu

So fügen Sie CSS zu HTML hinzu

(*-*)浩
(*-*)浩Original
2019-05-28 15:47:118920Durchsuche

Es gibt vier Hauptmethoden zum Hinzufügen von CSS in HTML: Inline, eingebettet, verlinkt und importiert.

So fügen Sie CSS zu HTML hinzu

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,

rrree

Import 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!

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:HTML CSS3 was istNächster Artikel:HTML CSS3 was ist