So fügen Sie einen CSS-Stil hinzu-Front-End-Fragen und Antworten-php.cn

So fügen Sie einen CSS-Stil hinzu

藏色散人

Freigeben： 2023-01-05 16:12:40

Original

10145 Leute haben es durchsucht

Methoden zum Hinzufügen von CSS-Stilen: 1. Fügen Sie über das Stilattribut von HTML hinzu. 2. Schreiben Sie den CSS-Stil in das Stil-Tag. 4. Fügen Sie über den Import Code hinzu, z .css)".

So fügen Sie einen CSS-Stil hinzu

Die Betriebsumgebung dieses Artikels: Windows7-System, HTML5- und CSS3-Version, Dell G3-Computer.

Wie füge ich einen CSS-Stil hinzu?

Wie füge ich einen CSS-Stil ein? Im folgenden Artikel erfahren Sie, wie Sie CSS-Stile einfügen. Es hat einen gewissen Referenzwert. Freunde in Not können sich darauf beziehen. Ich hoffe, es wird für alle hilfreich sein.

Vorbereitung

Bereiten Sie zunächst eine HTML-Datei vor: test.html. Es wird nicht empfohlen, Notepad++ zum Erstellen und Bearbeiten der Datei zu verwenden -8 ohne Stücklistenformat, sonst wird Chinesisch angezeigt. Verstümmelter Code, der Inhalt ist wie folgt:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
    </head>
    <body>
        hello
    </body>
</html>

Nach dem Login kopieren

Speichern Sie die Datei auf dem Desktop, klicken Sie mit der rechten Maustaste und wählen Sie Google Chrome (oder einen anderen Browser zum Öffnen) aus, um sie zu öffnen, und finden Sie das Auf der Seite erscheinen die englischen Buchstaben „Hallo“.

So fügen Sie einen CSS-Stil hinzu

Vier Möglichkeiten zur Einführung

Inline

wird über das Style-Attribut von HTML implementiert, wie unten gezeigt

//写在body标签中
<span style="color:red;">行内式</span>

Nach dem Login kopieren

Embedded

Schreiben Sie den CSS-Stil in das Style-Tag und zitieren Sie ihn in Der Körper

//写在style标签中的css样式
p{
    color:blue;
}
//写在body标签中
<p>嵌入式</p>

Nach dem Login kopieren

Linked

Verwenden Sie im Allgemeinen diese Methode und erstellen Sie eine neue CSS-Datei auf dem Desktop: test.css, der Inhalt ist ein CSS-Stil

//写在test.css文件中
div{
    color:yellow;
}

Nach dem Login kopieren

Fügen Sie die test.css-Datei in test.html ein

//写在head标签中引入css文件，href属性中的为绝对路径，当前在同一级目录下
<link href="test.css" type="text/css" rel="stylesheet" />
//写在body标签中
<div>链接式</div>

Nach dem Login kopieren

Import Die Formel

@import(url(demo.css))

Nach dem Login kopieren

wird grundsätzlich nicht verwendet, da die Seite zuerst HTML und dann CSS lädt, was zu einer Verzögerung im Seitenstil führt.

Erstellen Sie eine demo.css-Datei und schreiben Sie einen CSS-Stil.

//写在demo.css文件中
h2{
    color:green;
}

Nach dem Login kopieren

Verwenden Sie die @import-Methode, um die demo.css-Datei zu importieren

Weitere Details Für HTML/CSS-Kenntnisse besuchen Sie bitte die Rubrik „CSS-Video-Tutorial“!

Das obige ist der detaillierte Inhalt vonSo fügen Sie einen CSS-Stil hinzu. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!