Wie externe CSS auf eine Seite zu verlinken
So verknüpfen Sie eine HTML-Seite mit einem externen Cascading Style Sheet (CSS), legen Sie nur eine einzige Zeile Code in den Kopf Ihrer Seite, die den Namen und die Position der externen CSS-Datei in Bezug auf die Root-Ebene des Servers verweist, auf denen die Site befindet.
Die Codezeile für den Link muss irgendwo zwischen den Öffnungs- und Schließ Tags von jeder HTML-Seite auf Ihrer Website platziert werden, die Sie mit ihm gestylt werden soll.
Wenn der Dateiname der CSS genau in der HTML-Datei eingegeben wird, um den richtigen Link-Syntax, bietet die Link-Code Anweisungen an den Browser darüber, wie sollte die CSS-Style-Informationen auf der Seite ausgelegt und angewandt werden, die wiederum bestimmt, wie die Seite angezeigt wird in dem Browser.
Hier ist ein Beispiel für einen Link zu einer externen CSS-Datei mit dem Dateinamen main.css, wo die Datei, die bezogen wird verwendet der href Attribut des Link-Tags, die eine nicht geschlossene Tags in HTML ist:
Wenn der Link-Code zu einem XHTML-Seite hinzugefügt wird, muss das Tag durch Hinzufügen eines zusätzlichen Raum und Schrägstrich vor dem Ende geschlossen:
Die anderen Attribute innerhalb der Tag neben der href benötigt der Browser, um die Daten auf der verknüpften CSS-Datei zu interpretieren:
Das rel Attribut legt die Beziehung zwischen dem Originaldokument und der verknüpften Datei und identifiziert die verknüpfte Datei als Stylesheet.
Das Art Attribut gibt die Art von Stil Sprache innerhalb der verknüpften Datei verwendet werden, die in diesem Fall feststellt, dass die verknüpfte Datei in geschrieben # 147-text / css # 148- Format.
Aus Gründen der Konsistenz, versuchen Sie die CSS-Link in Ihre Web-Seiten an der gleichen Stelle im Code von Seite zu Seite zu platzieren. Zum Beispiel könnten Sie den Link-Tag direkt nach dem letzten Meta-Tag hinzuzufügen, oder es direkt über dem Schluss-Tag legen. konsistent zu sein, können Sie es jemals ändern müssen das Tag finden sollten Sie schnell helfen.
Neben der Platzierung der Link in den HTML-Seiten, die die externe CSS-Datei verwenden, sollten Sie auch zahlen einige Aufmerksamkeit auf, wo die CSS-Datei (en) auf die anderen Dateien innerhalb der Website befindet sich relativ.
Meistens hat jeder Standort nur eine CSS-Datei und die Datei befindet sich auf der obersten Ebene, das zu sagen, nur eine andere Art ist, dass die CSS-Datei als die in der gleichen Lage ist index.html Datei, die die Homepage für Ihre Website ist.
Die Root-Ebene bezieht sich auf die Erdgeschoss Ihrer Website, ob es sich um eine lokale Kopie Ihrer Website auf Ihrem Computer vor Ihnen oder einer Kopie der Website sitzt auf dem Remote-Host-Server. Bei den meisten Websites, sitzt die Homepage auf Root-Ebene zusammen mit einem Bilder Ordner und alle anderen Hauptseiten der Website.
Für größere Websites, einige Designer erstellen Unterordner auf Root-Ebene auf andere Dinge zu beherbergen wie externe javascript und jQuery-Dateien, externe CSS-Dateien, CGI-Skripte oder Gruppen von Seiten, die in eine ähnliche Kategorie fallen (zum Beispiel alle Seiten in Bezug auf A-Produkte oder Dienstleistungen des Unternehmens).
Sollte Ihre Website benötigen zwei oder mehr Cascading Style Sheets (vielleicht ein für alle Seiten und eine zweite für eine Handvoll Seiten, die gedruckt werden sollen), kann es von Vorteil sein, dass Sie einen separaten Ordner zu erstellen aufgerufen css auf der obersten Ebene der Website und dann die CSS-Dateien zusammen in speichern.
Sie können dann die einzelnen CSS von diesem Standort aus zugreifen, vorausgesetzt, dass die href Ihrer CSS zeigt Link, um den neuen Speicherort des Ordners zusammen mit dem Dateinamen:
href ="css / main.css" rel = "stylesheet" type = "text / css">