在LESS導入中選擇器內的Bootstrap媒體查詢？

我試圖將Bootstrap應用於特定的div。爲此，我正在導入Boostrap LESS文件，如下所示：在LESS導入中選擇器內的Bootstrap媒體查詢？

.bootstrap_wrap { 
    @import 'bootstrap/bootstrap.less'; 
    @import 'bootstrap/responsive.less';  
}

但是，這樣做似乎破壞了媒體查詢。

有什麼辦法可以有選擇地應用Boostrap而不破壞Boostrap CSS中的媒體查詢嗎？

2012-12-15 bfromsd

我會考慮只導入你需要的較少的文件（無論是modals.less，alerts.less等），而不是整個庫。如果您不希望媒體查詢受到影響，請移除'responsive.less'，因爲這是它的主要功能。 – DigTheDoug

這似乎是這個特定實例的最佳選擇。我也想知道這是否是更通用的解決方案 - 例如在不影響媒體查詢的情況下減少導入的方式。有任何想法嗎？ – bfromsd

你爲什麼需要這樣做？ –

這不是我清楚，如果你正在編寫本或使用less.js

我能夠編譯它沒有錯誤（使用Codekit），結果看起來不錯，只是確保路徑是正確的。

如果我創建

.bootstrap_wrap { 
@import 'bootstrap.less'; 
@import 'responsive.less';

}

新bootstrap_wrap.less文件並將其放置在同一目錄中的其他引導少的文件，然後編譯它是這樣的結果：
bootstrap_wrap.css

結果看好我，比如我看到：

@media (max-width: 767px) { 
.bootstrap_wrap #footer { 
margin-left: -20px; 
margin-right: -20px; 
padding-left: 20px; 
padding-right: 20px; 
} 
}

祝你好運！

2012-12-27 14:06:47

嗨，你還在爲此工作嗎？ –

回答