我正在使用web essentials 2012最新版本的visual studio 2012。 我正在關注這篇文章http://www.cutterscrossing.com/index.cfm/2013/5/20/Skinning-Bootstrap-Tabs的方向。 我有更少的文件中@import指令,當我保存文件時創建一個css文件。但是,在css文件中沒有任何內容。 我檢查了路徑,但路徑顯示有效。無法編譯進口
我的文件結構是...
新的空網站叫
bootstrapless project
css folder
bootstrap folder
All bootstrap less files
core folder
css folder
All css files generated from less files in core folder
core.less
overrides.less
variables.less
img folder
bootstrap folder
bootstrap glyphicons-halflings png files
js folder
bootstrap folder
All bootstrap js files
在自定義variables.less文件我有...
@iconSpritePath: "../../img/bootstrap/glyphicons-halflings.png";
@iconWhiteSpritePath: "../../img/bootstrap/glyphicons-halflings-white.png";
的變量。保存時創建的css輸出爲空
在自定義overrides.less文件我有...
@import "variables.less";
[class^="icon-"],
[class*=" icon-"] {
background-image: url("@{iconSpritePath}");
}
/* White icons with optional class, or on hover/focus/active states of certain elements */
.icon-white,
.nav-pills > .active > a > [class^="icon-"],
.nav-pills > .active > a > [class*=" icon-"],
.nav-list > .active > a > [class^="icon-"],
.nav-list > .active > a > [class*=" icon-"],
.navbar-inverse .nav > .active > a > [class^="icon-"],
.navbar-inverse .nav > .active > a > [class*=" icon-"],
.dropdown-menu > li > a:hover > [class^="icon-"],
.dropdown-menu > li > a:focus > [class^="icon-"],
.dropdown-menu > li > a:hover > [class*=" icon-"],
.dropdown-menu > li > a:focus > [class*=" icon-"],
.dropdown-menu > .active > a > [class^="icon-"],
.dropdown-menu > .active > a > [class*=" icon-"],
.dropdown-submenu:hover > a > [class^="icon-"],
.dropdown-submenu:focus > a > [class^="icon-"],
.dropdown-submenu:hover > a > [class*=" icon-"],
.dropdown-submenu:focus > a > [class*=" icon-"] {
background-image: url("@{iconWhiteSpritePath}");
}
在保存網頁要領創建具有以下內容的overrides.css ......在
[class^="icon-"],
[class*=" icon-"] {
background-image: url("../../img/bootstrap/glyphicons-halflings.png");
}
/* White icons with optional class, or on hover/focus/active states of certain elements */
.icon-white,
.nav-pills > .active > a > [class^="icon-"],
.nav-pills > .active > a > [class*=" icon-"],
.nav-list > .active > a > [class^="icon-"],
.nav-list > .active > a > [class*=" icon-"],
.navbar-inverse .nav > .active > a > [class^="icon-"],
.navbar-inverse .nav > .active > a > [class*=" icon-"],
.dropdown-menu > li > a:hover > [class^="icon-"],
.dropdown-menu > li > a:focus > [class^="icon-"],
.dropdown-menu > li > a:hover > [class*=" icon-"],
.dropdown-menu > li > a:focus > [class*=" icon-"],
.dropdown-menu > .active > a > [class^="icon-"],
.dropdown-menu > .active > a > [class*=" icon-"],
.dropdown-submenu:hover > a > [class^="icon-"],
.dropdown-submenu:focus > a > [class^="icon-"],
.dropdown-submenu:hover > a > [class*=" icon-"],
.dropdown-submenu:focus > a > [class*=" icon-"] {
background-image: url("../../img/bootstrap/glyphicons-halflings-white.png");
}
最後的自定義文件少核心文件夾是core.less文件。 此文件只具有以下進口...
@import "../bootstrap/bootstrap.less";
@import "overrides.less";
保存時創建一個空的CSS文件。再次,空着。
有什麼我失蹤了。我已經過了幾次指示,一切似乎都正確。
感謝
你用什麼命令編譯? –