少用twitter推薦

Question

我正在嘗試使用http://bootswatch.com/中的一種款式。我想將它們的無風格版本應用於bootstrap.css。要做到這一點，我做在http://lesscss.org/#usage描述如下：

<link href="bootstrap.css" rel="stylesheet" type="text/css"> 
<link href="variables.less" rel="stylesheet/less"> 
<link href="bootswatch.less" rel="stylesheet/less"> 
<script src="less.js" type="text/javascript"></script> 

但它不工作，即我還是有標準的引導主題。

爲了簡化我已經合併到variables.lessbootswatch.less，所以現在的代碼如下所示：

<link href="bootstrap.css" rel="stylesheet" type="text/css"> 
<link href="bootswatch.less" rel="stylesheet/less"> 
<script src="less.js" type="text/javascript"></script> 

但我仍然得到默認的引導主題。

我檢查過調試器和所有文件都正確鏈接，所以我想我在使用中做錯了什麼。

Answer 1

如果使用從bootswatch少的文件，我想你也需要從引導使用較少的文件。 variables.less文件將覆蓋原始文件中的值。

我做了什麼，使其工作是下載自舉減檔時，bootswatch.less和variables.less複製到同一文件夾中（我改名爲variables-bootswatch.less向前兼容，如果bootswatch是不是最新的）。

然後我修改了bootstrap.less文件，包括那些上述文件：

// Header and everything before variables.less 

@import "variables.less"; // Modify this for custom colors, font-sizes, etc 
@import "variables-bootswatch.less"; 

// everything else, then at the end 

@import "bootswatch.less"; 

最後，你只需要導入該文件（無CSS）

<link href="bootstrap.less" rel="stylesheet/less"> 
<script src="less.js" type="text/javascript"></script> 

---

看來，有是github上的一個項目，旨在爲您打造色板主題：swatchmaker on github。它應該產生適當的CSS文件。

Answer 2

我想你需要更改腳本文件的順序如下

<link href="bootstrap.css" rel="stylesheet" type="text/css"> 
<script src="less.js" type="text/javascript"></script> 
<link href="bootswatch.less" rel="stylesheet/less">