如何在LESS文件之間導入變量 - 目前變得'undefined'

Question

嘿，我對bootstrap比較陌生，並且正試圖將bootstraps響應式css導入到我的style.less文件中。

即

@import "css/bootstrap-responsive.css"; 

然後我申請以下

#menu, #sub-menu { 
.span2; 
color: @bodydarker1; 
height: 100%; 
min-height: 100%; 
padding: 1%; 
} 

而且.span2;出現在引導-responsive.css但是當我檢查它給我的留言頁面..

.span2 is undefined 
in style.less on line 26, column 2: 

現在，如果我在bootstrap-responsive.css中將紅色應用於body它會渲染那麼好，但是當我在類.span2中調用它的說法時，它的未定義。爲什麼會這樣？

如果我將.span2作爲類中的一個類來工作，但在導入到less文件時不會應用到id。

Answer 1

確保導入.less文件，而不是.css。你可以導入.css，我只建議總是從.less文件工作。在導入.css而不是.less時可能遇到更多問題。

它看起來像.LESS代碼結構只是一個不正確的。嘗試更換此：

#menu, #sub-menu { 
.span2; 
color: @bodydarker1; 
height: 100%; 
min-height: 100%; 
padding: 1%; 
} 

與此：

#menu, 
#sub-menu { 
    .span2 { 
     color: @bodydarker1; 
     height: 100%; 
     min-height: 100%; 
     padding: 1%; 
    } 
} 

編輯：

如果你想訪問您的自定義#menu ID下.span2那麼你就必須要請參閱namespace它在引導程序中（如果它在名稱空間下），然後相應地進行調整。

例

#bootstrap { 
    #lists { 
     .span2 { 
      // some span2 stuff 
     } 
    } 
} 

#menu, 
#sub-menu { 
    #bootstrap > #lists > .span2; 

    color: @bodydarker1; 
    height: 100%; 
    min-height: 100%; 
    padding: 1%; 
}