我试图在variables.less文件中覆盖@grid-float-breakpoint
:. (为了调整顶部菜单的折叠宽度)
在我的索引文件中,我将导入Bootstrap核心文件css文件:
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
然后我将导入已编译和调整后的变量文件。
<link rel="stylesheet/less" type="text/css" href="less/variables.less">
为什么我的变量无法覆盖bootstrap.min.css?
答案 0 :(得分:2)
无法以这种方式覆盖变量,因为它们已经编译为CSS。 Less是预处理器,因此您需要覆盖它们,然后编译并包含已编译的css。为此,您可以使用各种命令行工具(我使用http://gruntjs.com/和https://npmjs.org/package/grunt-contrib-less)或有应用程序!
请注意,您需要一个包含自定义值的单独的less文件,然后在导入变量后导入它。例如。
@import "bootstrap.less"; /* Imports all the bootstrap less files in the correct order, including variables.less */
@import "custom-variables.less"; /* Your custom less variables */
有关详细信息,请参阅此答案Overriding Bootstrap LESS variables after @import。