是否有任何方法可以用Sass的@import命令导入一个常规的CSS文件?虽然我没有使用sass的所有SCSS语法,但我仍然喜欢它的组合/压缩功能,并且希望能够使用它,而不必将我的所有文件重命名为*.scss
当前回答
简单。
@import “路径/到/文件.css”;
其他回答
现在可以使用:
@import 'CSS:directory/filename.css';
简单。
@import “路径/到/文件.css”;
这是从3.2版本开始实现和合并的(2015年1月2日为libsass合并了#754,最初的问题定义在这里:sass#193 #556, libsass#318)。
长话短说,下面的语法:
导入(包括)原始css文件,语法是**,结尾没有' .css ' **扩展名(导致实际读取部分' s[ac]ss|css ',并将其内联到SCSS/SASS): @ import“路径/ /文件”; 以传统的方式导入CSS文件,语法按照传统的方式,**以' .css '扩展名**结尾(结果是' @import url("path/to/file.css"); '在你编译的CSS中): @ import“路径/ / file.css”;
它非常好:语法优雅简洁,而且向后兼容!它与libsass和node-sass一起出色地工作。
__
为了避免在评论中进一步猜测,明确地写下:基于Ruby的Sass在经过7年的讨论后仍然没有实现这个特性。在写这篇文章的时候,我们承诺在4.0中会有一个简单的方法来实现这一点,可能是@use的帮助。似乎很快就会有一个实现,新的“计划中的”“提案已接受”标签被分配给#556问题和新的@use特性。
UPD:在2020年10月26日,lib-sass被弃用,因此第556期立即关闭。
__
答案可能会更新,只要有一些变化。
如果我是正确的,css与scss兼容,所以你可以将css的扩展名更改为scss,它应该继续工作。一旦你改变了扩展名,你可以导入它,它将包含在文件中。
如果你不这样做,sass将使用css @import,这是你不想要的。
你必须在要包含的css文件前加上一个下划线,并将其扩展名切换为scss(例如:_yourfile.scss)。那么你只需要这样称呼它:
@import "yourfile";
它将包含文件的内容,而不是使用CSS标准的@import指令。
推荐文章
- ' coll -xs-* '在引导4中不工作
- 什么是类="mb-0"在引导4?
- 当flexbox项目以列模式换行时,容器的宽度不会增长
- CSS单位- vh/vw和%之间的区别是什么?
- :在Sass中的伪元素选择器之后和之前
- <div>元素中的中心元素
- 如何选择一个元素与2类
- CSS @media打印问题与背景颜色;
- 样式输入元素以填充其容器的剩余宽度
- <字段集>调整大小错误;似乎有不可移动的“min-width: min-content”
- 子节点max-height: 100%溢出父节点
- 如何在表中删除行和列之间不需要的空间?
- Browserslist: canius -lite已经过时。请运行下一个命令' npm update caniuse-lite browserslist '
- 我如何在HTML中创建一个泪滴?
- 我怎么能强迫一个长字符串没有任何空白被包装?