Question

我的main.scss文件如下：

@import "components/variables.scss"; // This file contains all font variables etc  

@import "components/global.scss"; // This file contains global styles to be applied 

@import "components/header.scss"; // All header and top menu navigation

@import "components/bslider.scss"; // The main middle slider that have whole content of webside as slides.

我在每个@import语句之后添加了换行符，但是当生成输出时，各个文件的css之间没有空格。输出是这样的：

* {
    font-size: 14px;
}
/*global css finishes*/
/*header css starts*/
header {
    position: absolute;
}

但我想要这样的换行：

* {
    font-size: 14px;
}
/*global css finishes*/


/*header css starts*/
header {
    position: absolute;
}

我正在使用yeoman webapp生成器将sass转换为css。任何帮助将不胜感激，谢谢。

Answer 1

我没有使用过yeoman，但是你可以改变输出的css的风格

sass --watch yourfile.scss:style.css --style expanded

您可以在此处阅读有关SASS样式的更多信息：

http://sass-lang.com/documentation/file.SASS_REFERENCE.html#output_style

如何在两个@imported sass文件之间添加换行符？

1 个答案: