eine ‚Backup‘ CSS-Datei mit?

StackOverflow https://stackoverflow.com/questions/868268

  •  22-08-2019
  •  | 
  •  

Frage

Gibt es eine Möglichkeit ein Stylesheet zu rufen, und nur , wenn es nicht verfügbar ist, rufen Sie ein Stylesheet von einem anderen Standort?

So etwas wie folgt aus: 

<link rel="Stylesheet" type="text/css" href="http://cdn.somewhere.com/css/style.css" />
<link rel="Stylesheet" type="text/css" href="local/style.css" />

Aber nur die zweite nennen, wenn der erste nicht verfügbar ist? Ich will nicht zwei Anrufe machen, wenn es nicht notwendig ist. Danke.

EDIT: Das ist, weil ich bei der Arbeit bemerkt, mein CDN blockiert wird, so dass keine Arten zeigen aber die Seite tut. Ich bin eine Menge von Orten unter der Annahme, kann den gleichen Block hat (Firewall Web-Anwendungen zu blockieren). Also dann würde Ich mag die CSS aus der lokalen Kopie greifen.

War es hilfreich?

Lösung

Es ist nicht möglich, in reinem HTML-Markup. Sie können jedoch dieses tun serverseitige mit einem einfachen Skript, z.B. (Pseudo-Code): 

if first style does not exist:
    output <link> to second sheet
else
    output <link> to primary sheet

In Wirklichkeit aber sind Ihre Stylesheets wahrscheinlich durch den Browser im Cache gespeichert werden, so dass es kaum eine Belastung für den Endverbraucher setzen. Sie könnten einfach bestellen Sie die s, so dass die ‚zweite‘ Stylesheet lädt zuerst, und die primären Blattlasten Sekunde. Dies würde das primäre Blatt verursacht etwas im Sekundärblatt außer Kraft zu setzen ... aber wenn das primäre Blatt nicht verfügbar ist, würde das Sekundärblatt immer noch funktionieren wie vorgesehen.

Andere Tipps

JavaScript / AJAX ist stark nicht empfohlen aufgrund seiner sehr unvorhersehbares Verhalten (ich spreche nicht über Cross-Browser-Kompatibilität, aber einige Benutzer schaltete es aus.)

Wenn ich Sie wäre, würde ich die Existenz des ersten gegebenen CSS überprüfen Server-Seite und legen Sie die href entsprechend.

Denken Sie auch daran, dass, wenn Sie wirklich haben diese Art von Mechanismus zu verwenden, um sicherzustellen, dann sind Sie sagen, Ihre Server sind nicht zuverlässig.

Nein

, da LINK Elemente selbst sind statisch ( "stumm"). So müssen Sie entweder JavaScript, Greasemonkey (auf Firefox, aber das ist JavaScript, auch) oder man muss wirklich für beide fragen.

muss die Reihenfolge unterschiedlich sein, aber IIRC: Die gleiche CSS-Regel ein ein früheres überschreibt. So müssen Sie die lokale Datei schließen, zuerst, und dann die externen eine laden. Wenn der extern man nicht verfügbar ist, wird die lokale Kopie verwendet werden.

Wenn Sie die CSS-Datei auf der lokalen Festplatte setzen, wird dies ziemlich billig sein.

das gesagt ist, wird nicht immer der Browser die Datei herunterladen. Es wird zunächst prüfen, ob die Kopie in seinem Cache noch aktuell ist und wenn es ist, es wird nicht die Datei erneut herunterladen.

Sie standardmäßig könnte den ‚local.css‘ verwenden und Javascript (mit Ajax), um die neuen zu laden. Wenn die Anforderung die neue CSS-Datei laden, es wird in Ordnung, sonst, die Sie gerade nichts ändern.

Ehmm ... Sie coudl verwenden:

Ich weiß nicht, ob das alternative Sheet geladen wird, wenn die erste nicht, aber man könnte versuchen, wenn nicht sicher, dies lesen: A List Apart Tutorial für das Ändern von Stylesheets

Dies kann durch JavaScript erreicht werden. Code sollte wie folgt sein: 

if( loadcss(first.css) == false) loadcss(second.css);

wo loadcss ist Funktion überprüft, ob CSS geladen ist oder nicht

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top