标签:文件 mic text body 文件中 sass microsoft 合并 hover
顾名思义,表示的是加载其他文件的内容到本文件中
sass中使用该方式加载的时候是直接将两个文件的内容合二为一使用
a.scss文件
div { width: 200px; height: 200px; background-color: red; p { color: white; font-size: 20px; a { text-decoration: none; } &:hover { color: blue; } } } a{ font-size:16px; }
b.scss文件中使用@import加载a.scss文件
@import "a"; * {margin: 0;padding: 0;} a {text-decoration: none;} a{font-family:‘Microsoft YaHei‘}
最后得到的css中包含上面两个sass文件所编辑的所有样式
div { width: 200px; height: 200px; background-color: red; } div p { color: white; font-size: 20px; } div p a { text-decoration: none; } div p:hover { color: blue; } a { font-size: 16px; } * { margin: 0; padding: 0; } a { text-decoration: none; } a { font-family: "Microsoft YaHei"; }
如果你不希望将一个 Sass 的代码文件编译到一个 CSS 文件,你可以在文件名的开头添加一个下划线。这将告诉 Sass 不要将其编译到 CSS 文件。
但是,在导入语句中我们不需要添加下划线。
Sass Partials 语法格式:
_filename;
以下实例创建一个 _colors.scss 的文件,但是不会编译成 _colors.css 文件:
//_colors.scss 文件代码: $myPink: #EE82EE; $myBlue: #4169E1; $myGreen: #8FBC8F;
如果要导入该文件,则不需要使用下划线:
@import "colors"; body { font-family: Helvetica, sans-serif; font-size: 18px; color: $myBlue; }
转换出的css文件,中使用了_color.scss文件中的变量,但是没有将其合并到文件中
body { font-family: Helvetica, sans-serif; font-size: 18px; color: #4169E1; } /*# sourceMappingURL=b.css.map */
标签:文件 mic text body 文件中 sass microsoft 合并 hover
原文地址:https://www.cnblogs.com/camellioil/p/14694999.html