什么是scss,怎么在一个VUE项目中使用scss
首先什么是scss呢?scss是一种css预处理语言,是一个css的扩展,它在css语法的基础上,允许您使用变量,嵌套规则,混合,导入,继承等功能,使得css更加强大和优雅,而且其完全兼容css3。scss与sass的区别:scss仅在css3的基础上进行扩展,这意味着每个css样式表是一个同等的scss文件。此外,scss也支持大多数css hacks写法以及浏览器专属前缀语法。这种语法的...
·
首先什么是scss呢?
scss是一种css预处理语言,是一个css的扩展,它在css语法的基础上,允许您使用变量,嵌套规则,混合,导入,继承等功能,使得css更加强大和优雅,而且其完全兼容css3。
scss与sass的区别:
scss仅在css3的基础上进行扩展,这意味着每个css样式表是一个同等的scss文件。此外,scss也支持大多数css hacks写法以及浏览器专属前缀语法。这种语法的样式表文件需要以.scss
作为拓展名
而sass,被称为缩进语法,它提供了一种更加简便的方式来书写css。它使用缩进而不是花括号来表示选择器的嵌套,用换行而不是分号来分隔属性。使用此语法的样式表文件需要以.sass
作为扩展名。
在VUE项目中安装scss
- 安装sass依赖包,打开命令行输入:
2.安装完依赖后,在webpack.config.js的rules里面添加配置
3.在使用scss的时候在所在的style样式标签上添加lang="scss"即可。
4.scss使用测试:使用变量来设置div的背景颜色
更多推荐
已为社区贡献1条内容
所有评论(0)