Analyse und Lösung der Gründe, warum HTML-externe Referenz-CSS-Dateien nicht effektiv sind

Analyse und Lösung der Gründe, warum HTML-externe Referenz-CSS-Dateien nicht effektiv sind
Als Frontend-Neuling habe ich einige Tage am Frontend herumgebastelt. . Heute habe ich plötzlich festgestellt, dass es bei etwas, woran ich fest glaubte, tatsächlich Probleme gab. . Ich habe beispielsweise ein CSS-Stylesheet im CSS-Verzeichnis style.css geschrieben. Es enthielt nur einen Satz:
XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. Körper {
  2. Hintergrundfarbe: #ddd;
  3. }
Dann importiere ich dieses externe CSS in meine HTML-Datei:
XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. < Link   rel = "Stilvorlage"   Typ = "Text/CSS"   href = "css/style.css" >    

Aktualisieren Sie im Browser. . Wow, kao. Es gab keine Antwort. Es hat nicht funktioniert. . Ich habe den Pfad mehrmals überprüft, um sicherzustellen, dass kein Problem vorlag, und den F12-Debugger von Chrome geöffnet. Nachdem ich sichergestellt hatte, dass der Browser die CSS-Datei geladen hatte, öffnete ich sie und sah:


Es ist verstümmelt. . Irgendetwas stimmt wohl mit dem Kodierungsformat nicht, aber ich weiß nicht, was ich tun soll. . Nach Rücksprache mit einem Frontend-Partner habe ich die aktuelle Kodierung der Webseite überprüft:


Die angezeigte Kodierung ist UTF-16LE. .
Später habe ich es ausprobiert und mit dem Sublime-Editor das lokale CSS-Dateikodierungsformat in dieses UTF-16LE geändert:


Den CSS-Code neu geschrieben. Speichern Sie den Lauf. . Es funktioniert wie erwartet. .
Aber mein HTML ist als UTF-8 angegeben, während das CSS UTF-16 ist, was mich sehr unglücklich macht. . Also habe ich erneut nach einer Lösung gefragt. Es kann gelöst werden, und es ist einfach. .
Ändern Sie das CSS zurück zu UTF-8 und bearbeiten Sie den darin enthaltenen Code. Geben Sie beim Importieren dieses CSS in HTML einfach das Kodierungsformat an:


Fügen Sie dem Link-Tag einfach ein Attribut hinzu: charset="utf-8". . . So einfach ist das. . .

Das ist alles, was ich zu den Gründen zu sagen habe, warum HTML-Dateien mit externen Referenzen auf CSS nicht wirksam werden, und zu den Lösungen. Ich hoffe, es wird Ihnen helfen!

<<:  CSS3 zum Erreichen eines Menü-Hover-Effekts

>>:  Detaillierte Erläuterung der Kommentare zu gespeicherten MySQL-Prozeduren

Artikel empfehlen

Einführung in die Funktionen und Verwendung von Wert- und Namensattributen in HTML

1. Der in der Schaltfläche verwendete Wert bezieht...

Zwei Möglichkeiten zur Installation von Python3 auf Linux-Servern

Erste Methode Alibaba Cloud- und Baidu Cloud-Serv...

Leitfaden zum Schreiben von HTML-Code

Gängige Konventions-Tags Selbstschließende Tags, ...

Zusammenfassung der Kompatibilitätsprobleme beim Flex-Layout

1. W3C-Versionen von Flex Version 2009 Flag: Anze...

So verwenden Sie das Vue-Router-Routing

Inhaltsverzeichnis 1. Beschreibung 2. Installatio...

Einige Hinweise zur MySQL-Self-Join-Deduplizierung

Lassen Sie mich kurz das Funktionsszenario erklär...

9 praktische Tipps zum Erstellen von Webinhaltsseiten

Inhalt 1. Geben Sie den Lesern einen Grund zu blei...

Detaillierte Konfiguration der drahtlosen Netzwerkkarte unter Ubuntu Server

1. Stecken Sie die WLAN-Karte ein und prüfen Sie ...