Mengapa Kod LESS.js Saya Tidak Berfungsi dalam Chrome?

Isu Keserasian LESS.js dalam Chrome

Anda telah menghadapi situasi di mana LESS.js kelihatan berfungsi dalam Firefox tetapi tidak dalam Chrome. Untuk menentukan punca asas, mari kita periksa kod yang anda berikan:

<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>

Kod tersebut kelihatan betul dari segi sintaksis, tetapi mari kita atasi pemerhatian anda bahawa html { background: red; } juga tidak berkuat kuasa dalam Chrome.

Penjelasan terletak pada isu yang diketahui dengan Chrome. Menurut dokumentasi LESS.js, skrip penyemak imbas tidak akan berfungsi jika laluan ke halaman anda bermula dengan "file:///" disebabkan oleh pengehadan khusus Chrome.

Kepada selesaikan isu ini, pertimbangkan untuk menggunakan pelayan web untuk mengehoskan halaman anda dan bukannya membukanya terus daripada fail setempat. Sebagai alternatif, anda boleh meneroka menggunakan fail LESS CSS pra-bina dan bukannya bergantung pada skrip penyemak imbas.

Atas ialah kandungan terperinci Mengapa Kod LESS.js Saya Tidak Berfungsi dalam Chrome?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!