Eine kurze Zusammenfassung zum Schreiben von Pfaden, wenn HTML-Dateien externe CSS-Dateien einführen

1. Importieren Sie den grundlegenden Stil externer CSS-Dateien

Verwenden Sie das Tag <link>, um ein externes Stylesheet einzuführen, das normalerweise zwei Attribute hat:

• Das href-Attribut gibt den Pfad der CSS-Datei an
• rel="stylesheet" beschreibt die Beziehung zwischen der aktuellen Seite und dem durch href angegebenen Dokument. Das heißt, das durch href verbundene Dokument ist ein neues Stylesheet.

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

2. Grundregeln des Pfades

/ steht für das Stammverzeichnis. Verwenden Sie es mit Vorsicht.
…/ stellt das vorherige Verzeichnis dar
…/…/ stellt die beiden Ebenen über dem Verzeichnis dar
/… stellt das Verzeichnis der unteren Ebene dar
/…/… stellt die nächsten beiden Verzeichnisebenen dar

3. Beispiele für gängiges Pfadschreiben

1. Die Dateien index.html und style.css befinden sich im selben Ordner

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

2. Die CSS-Datei befindet sich im selben Ordner wie die HTML-Datei

<link href="c/style.css" rel="stylesheet" />

3. Der übergeordnete Ordner der HTML-Dateien und der übergeordnete Ordner der CSS-Dateien befinden sich im selben Ordner

Wie in der Abbildung gezeigt: Unter Ordner A befinden sich die Ordner B und B2, style.css befindet sich im Ordner C unter Ordner B und index.html befindet sich im Ordner B2.

• Die Idee hinter dem Schreiben des Pfads zu diesem Zeitpunkt ist: Suchen Sie den gemeinsamen übergeordneten Ordner der Datei index.html und der Datei style.css. In der Abbildung ist dies Ordner a.
• Beginnen Sie zunächst mit der Datei index.html, also im Ordner b2, und suchen Sie zunächst den Ordner a (das übergeordnete Verzeichnis des Ordners b2), nämlich: …/
• Suchen Sie dann die Datei style.css im Ordner a, also: b/c/style.css
• Zusammen kombiniert: href="…/b/c/style.css"

<link href="../b/c/style.css" rel="stylesheet" />

Damit ist dieser Artikel zum Schreiben von Pfaden beim Importieren externer CSS-Dateien in HTML-Dateien abgeschlossen. Weitere Informationen zum Importieren externer CSS-Pfade aus HTML finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den verwandten Artikeln weiter unten. Wir hoffen, dass jeder 123WORDPRESS.COM in Zukunft unterstützen wird!