Warum können benutzerdefinierte Stilblätter auf lokalen Webseiten in Safari, nicht jedoch auf Baidu -Seiten wirksam?

Safari Custom Stylesheet: Effektiv lokal, ungültig aus der Ferne?

Dieser Artikel analysiert ein gemeinsames Problem mit Safari Browser Custom Style Sheets: Warum fällt das benutzerdefinierte CSS, das auf lokale Webseiten wirkt, beim Zugriff auf Remote -Websites wie Baidu fehl?

Ein Front-End-Entwickler, der ein benutzerdefiniertes Stylesheet in Safari-Einstellungen verwendet, probieren Sie den folgenden CSS-Code aus:

 Körper {
    Hintergrundbild: URL ("/Benutzer/Luxus/Desktop/Wallhaven-O5762l.png")! Wichtig;
}

Die Testergebnisse zeigen, dass der Stil unter der lokalen Webseite (Dateiprotokoll) wirksam wird, während der Stil unter der Baidu -Webseite (HTTP -Protokoll) abgelaufen ist.

Der Schlüssel zu dem Problem liegt in Protokollunterschieden und Ressourcenpfade . Lokale Webseiten verwenden das Dateiprotokoll, um direkt auf das lokale Dateisystem zuzugreifen. Während Baidu -Webseiten das HTTP -Protokoll verwenden, um auf den Remote -Server zuzugreifen. url("/Users/luxury/Desktop/wallhaven-o5762l.png") im benutzerdefinierten Stilblatt versucht, das lokale Bild zu verweisen, das in der Remote-Webumgebung offensichtlich unzugänglich ist.

Der Browser analysiert die URL nach dem Protokoll der aktuellen Webseite. Auf der Baidu-Seite wird der Browser versuchen, http://www.baidu.com/Users/luxury/Desktop/wallhaven-o5762l.png zu besuchen. Dieser Pfad existiert nicht, wodurch das Bild nicht geladen wird, was zu einem Stilfehler führt. Obwohl die CSS -Regeln selbst angewendet werden können, kann das Hintergrundbild aufgrund der Bildressource 404 nicht angezeigt werden. Das Web -Panel der Entwicklertools kann dies überprüfen.

Darüber hinaus kann Safari's User Style Sheet -Mechanismus Einschränkungen bei der Verarbeitung lokaler Dateipfade aufweisen. Zur weiteren Überprüfung wird empfohlen, den CSS -Code beispielsweise zu ändern:

 Körper {
    Hintergrund: #ffbe-URL ("/Benutzer/Luxus/Desktop/Wallhaven-O5762l.png")! Wichtig;
}

Dadurch wird eine Standard -Hintergrundfarbe festgelegt, und Sie können beobachten, ob der Stil angewendet wird, auch wenn das Bild nicht geladen wird.

Kurz gesagt, vermeiden Sie in benutzerdefinierten Stylesheets die Verwendung von Dateiprotokoll und lokalen Absolute -Pfad -Referenzressourcen, insbesondere Projekte, die an Servern bereitgestellt werden. Der korrekte Ansatz besteht darin, relative Pfade oder vollständige Netzwerkpfade zu verwenden, um sich auf Ressourcen zu beziehen.

Das obige ist der detaillierte Inhalt vonWarum können benutzerdefinierte Stilblätter auf lokalen Webseiten in Safari, nicht jedoch auf Baidu -Seiten wirksam?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!