LESS.js 스타일 시트에 변수 전달

Question

데이터베이스에 여러 변수 (16 진수 색상)가 정의되어 있습니다. PHP를 통해 MySQL에서 LESS.js 스타일 시트로 이러한 변수를 전달해야합니다. 가능한?

그렇지 않은 경우 비슷한 방법에 대한 조언이 필요합니까? 밝고 어두워지는 변수가 핵심입니다.

Answer 1

가장 좋은 접근 방법은 입니다.은 PHP를 사용하여 파일을 생성합니다 (사용자의 vars 포함).

1 \ HTML 페이지에 새 스타일 시트를 포함해야합니다. 하단에 다음

<?php header("Content-type: text/css; charset: UTF-8"); ?> 

@brand_color_1 = <?php echo $brand_color_1; ?>; 
/* Add all other vars do you need. */ 

3 \ (또는 덜 VAR 선언 후) 다음과 같이 style.php의이 모든 필요한 수입을 추가하여 style.php에서

<link rel='stylesheet/less' href='css/style.php' /> 

2 \는 다음과 같이 PHP가 바르 포함 :

<?php 
    header("Content-type: text/css; charset: UTF-8"); 

    @brand_color_1 = <?php echo $brand_color_1; ?>; 
    /* Add all other vars do you need. */ 

    @import "style.less"; 
?> 

이것은 시계처럼 작동합니다.

read about CSS Variables with PHP 수있는 문서가 Chris Coyier으로 작성되었습니다.

<script type="text/javascript"> 
var colors = ''; 
colors += '@brand_color_1: <?php echo $brand_color_1 ?>;' 
colors += '@brand_color_2: <?php echo $brand_color_2 ?>;' 
colors += '@import "style.less"'; 
// Add other imports. 
var parser = new (less.Parser)(); 
parser.parse(colors, function(err, tree) { 
    var css = tree.toCSS(); 
    // Add it to the DOM maybe via jQuery 
}); 
</script> 

Answer 2

CSS :

---

또 다른 하지 않는 것이 좋습니다 대안은 당신이 수동으로를 컴파일하고 PHP 다음을 수행 바르 통과, 클라이언트 측에서 당신에게 LESS 파일을 수 컴파일

#header { 
    color:black; 
    border:1px solid #dd44dd; 
} 

#header .navigation { 
    font-size:12px; 
} 

#header .navigation a { 
    border-bottom:1px solid green; 
} 

#header .logo { 
    width:300px; 
} 

#header .logo:hover { 
    text-decoration:none; 
} 

LESS :

#header { 
    color:black; 
    border:1px solid #dd44dd; 
    .navigation { 
     font-size:12px; a { 
      border-bottom:1px solid green; 
     } 
    } 
.logo