Warum funktioniert mein LESS.js-Code in Chrome nicht?

LESS.js-Kompatibilitätsproblem in Chrome

Sie sind auf eine Situation gestoßen, in der LESS.js in Firefox zu funktionieren scheint, in Firefox jedoch nicht Chrom. Um die zugrunde liegende Ursache zu ermitteln, untersuchen wir Ihren bereitgestellten Code:

<code class="html"><link rel="stylesheet/less" href="css/style.less" />
<script src="http://lesscss.googlecode.com/files/less-1.0.21.min.js"></script>

@highlight: #cb1e16;
@shade1: #cb1e16;
@tone1: #5c6f7d;
@grad1: #e6edf3;
@grad2: #8a8d92;
@text1: #333e44;

header, footer, section, article, nav, aside { display: block; }

.grad {
  background: @grad2;
  background: -moz-linear-gradient(top, @grad1, @grad2 1200px);
  background: -webkit-gradient(linear, 0 0, 0 1200, from(#e6edf3), to(#8a8d92));
}

html {
  .grad;
  min-height: 100%;
}</code>

Der Code erscheint syntaktisch korrekt, aber gehen wir auf Ihre Beobachtung ein, dass html { background: red; } wird auch in Chrome nicht wirksam.

Die Erklärung liegt in einem bekannten Problem mit Chrome. Laut der LESS.js-Dokumentation funktioniert das Browser-Skript aufgrund einer Chrome-spezifischen Einschränkung nicht, wenn der Pfad zu Ihrer Seite mit „file:///“ beginnt.

Zu Um dieses Problem zu beheben, sollten Sie die Verwendung eines Webservers zum Hosten Ihrer Seite in Betracht ziehen, anstatt sie direkt aus einer lokalen Datei zu öffnen. Alternativ können Sie die Suche auch mit einer vorgefertigten LESS-CSS-Datei durchführen, anstatt sich auf das Browser-Skript zu verlassen.

Das obige ist der detaillierte Inhalt vonWarum funktioniert mein LESS.js-Code in Chrome nicht?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!