So verbinden Sie HTML mit CSS-HTML-Tutorial-php.cn

So verbinden Sie HTML mit CSS

下次还敢

Freigeben： 2024-04-11 11:21:42

Original

876 Leute haben es durchsucht

HTML stellt über das <link>-Tag eine Verbindung zu CSS her. Das rel-Attribut des Tags ist auf „stylesheet“ gesetzt und das href-Attribut gibt den Pfad zur CSS-Datei an. Die Schritte umfassen: Erstellen einer CSS-Datei, Schreiben von Stilregeln und Verbinden der CSS-Datei mit dem HTML-Dokument. Die spezifische Syntax lautet: .

So verbinden Sie HTML mit CSS

HTML So verbinden Sie CSS

Das Verbinden von CSS in HTML kann über das <link>-Tag erreicht werden. Das <link>-Tag wird verwendet, um externe Ressourcen, wie z. B. CSS-Stylesheets, in HTML-Dokumente einzuführen. <link> 标签实现。<link> 标签用于在 HTML 文档中引入外部资源，例如 CSS 样式表。

语法：

<code class="html"><link rel="stylesheet" href="style.css"></code>

Nach dem Login kopieren

属性说明：

rel: 指定资源的类型，对于 CSS 样式表，值为 "stylesheet"。
href: 指定要引入的 CSS 文件的路径。路径可以是绝对路径（从根目录开始）或相对路径（从当前 HTML 文件开始）。

连接步骤：

创建 CSS 文件：用文本编辑器创建一个新的文件，并使用 .css 作为扩展名（例如：style.css）。
编写 CSS 样式：在 CSS 文件中编写样式规则，定义元素的各种样式属性。
将 CSS 文件链接到 HTML：在 HTML 文档中，在 <head> 标签内插入 <link> 标签，并指定 rel="stylesheet" 和 href 属性。

示例：

<code class="html"><!DOCTYPE html>
<html>
<head>
  <title>HTML 和 CSS</title>
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <h1>标题</h1>
  <p>段落文本</p>
</body>
</html></code>

Nach dem Login kopieren

在上面的示例中：

style.css 是 CSS 文件的名称。
标签将 CSS 文件连接到 HTML 文档。
HTML 文档中的内容将采用 style.css

Syntax: 🎜🎜rrreee🎜🎜Attributbeschreibung: 🎜🎜

🎜rel:🎜 Gibt den Typ der Ressource an. Für CSS-Stylesheets ist der Wert „stylesheet“. 🎜
🎜href:🎜 Geben Sie den Pfad zur zu importierenden CSS-Datei an. Der Pfad kann absolut (ausgehend vom Stammverzeichnis) oder relativ (ausgehend von der aktuellen HTML-Datei) sein. 🎜🎜🎜🎜Verbindungsschritte: 🎜🎜
1. 🎜CSS-Datei erstellen: 🎜Erstellen Sie eine neue Datei mit einem Texteditor und verwenden Sie .css als Erweiterung (zum Beispiel: style.css). 🎜
2. 🎜CSS-Stile schreiben: 🎜Stilregeln in CSS-Dateien schreiben, um verschiedene Stilattribute von Elementen zu definieren. 🎜
3. 🎜Verknüpfen Sie CSS-Dateien mit HTML: 🎜Fügen Sie im HTML-Dokument das <link>-Tag in das <head>-Tag ein und geben Sie an rel="stylesheet"- und href-Attribute. 🎜
🎜🎜Beispiel: 🎜🎜rrreee🎜Im Beispiel oben: 🎜
- style.css ist der Name der CSS-Datei. 🎜
- Tag verbindet CSS-Dateien mit HTML-Dokumenten. 🎜
- Der Inhalt des HTML-Dokuments übernimmt die in style.css definierten Stile. 🎜🎜

Das obige ist der detaillierte Inhalt vonSo verbinden Sie HTML mit CSS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!