Sass(Scss)
文章平均质量分 83
Sass(Scss)学习记录
努力的小朱同学
未来很长,梦想很远。
展开
-
Sass(Scss) 学习笔记(三)--- 混合器和继承
一、混合器1、概念 在sass我们可以通过变量来复用小规模的样式(颜色、字体等),但如果我们想要复用一整段的样式代码,那变量就没办法了。还好sass定义了一个新特性 — 混合器 ,来专门实现多行代码的复用。如果你发现自己在不停地重复一段样式,那就应该把这段样式构造成混合器,尤其是这段样式本身就是一个逻辑单元,比如说是一组放在一起实现某个特定的页面样式。 混合器的样式也不一定是一成不变的,可以通过参数的形式没生成特定的样式。 但混合器也不能滥用,滥用混合器,可能会导致代码很少,但生成的样式原创 2022-01-03 23:13:03 · 1977 阅读 · 2 评论 -
Sass(Scss) 学习笔记(二)--- 导入和注释
一、@import 导入 CSS有一个 @import 规则,可以在一个css文件中导入其他css文件,然而这样会有一个弊端:只有执行到@import 语句所在行的之后,浏览器才会去加载相应的css文件,这会导致页面加载变慢。而Sass在css的基础上改进了@import 规则,但你在.sass/.scss 文件中 通过@import引用样式文件时,它就会在编译成css文件时,就把相关文件导入,相当于所有相关的样式被归纳到了一个css文件中,浏览器只需发起一次加载请求。 @import 导入的规原创 2022-01-03 21:57:45 · 4402 阅读 · 0 评论 -
Sass(Scss) 学习笔记(一)--- 变量和嵌套
一、概念 Sass(Syntactically Awesome StyleSheets)是 CSS的一款预处理器,能完全兼容CSS3的语法,在CSS 语法的基础上增加了变量的、混合、导入等概念,利用嵌套语法的方式,大大减少了 CSS 重复代码的书写,提高项目的开发效率。 Sass有两种语法格式:Sass 和 Scss,其中Scss(Sassy CSS)是在CSS3的基础上进行扩展,加入一些Sass特有的功能,所有的CSS3语法都可以使用,而且支持浏览器前缀写法,扩展名为.scss,是本文所讲述语原创 2022-01-02 23:10:14 · 2677 阅读 · 1 评论