내 LESS.js 코드가 Chrome에서 작동하지 않는 이유는 무엇입니까?-CSS 튜토리얼-php.cn

내 LESS.js 코드가 Chrome에서 작동하지 않는 이유는 무엇입니까?

Susan Sarandon

풀어 주다： 2024-11-03 18:05:03

원래의

478명이 탐색했습니다.

Why Doesn't My LESS.js Code Work in Chrome?

Chrome의 LESS.js 호환성 문제

LESS.js가 Firefox에서는 작동하지만 Firefox에서는 작동하지 않는 상황이 발생했습니다. 크롬. 근본 원인을 파악하기 위해 제공된 코드를 검토해 보겠습니다.

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

로그인 후 복사

코드는 구문적으로는 정확하지만 html { background: red; }는 Chrome에서도 적용되지 않습니다.

설명은 Chrome의 알려진 문제에 있습니다. LESS.js 문서에 따르면 Chrome 관련 제한으로 인해 페이지 경로가 "file:///"로 시작하는 경우 브라우저 스크립트가 작동하지 않습니다.

이 문제를 해결하려면 로컬 파일에서 페이지를 직접 여는 대신 웹 서버를 사용하여 페이지를 호스팅하는 것이 좋습니다. 또는 브라우저 스크립트에 의존하는 대신 사전 구축된 LESS CSS 파일을 사용하여 탐색할 수 있습니다.

위 내용은 내 LESS.js 코드가 Chrome에서 작동하지 않는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!