做网站的公司都有哪些岗位,wordpress颜色插件,dedecms搭建购物网站,牛牛襄阳做网站sass的优缺点 优点#xff1a;css预处理器为css增加一些编程的特性#xff0c;无需考虑浏览器的兼容性问题。支持嵌套、变量和逻辑等。可以让css更加简介、提高代码复用性、逻辑分明等等。 缺点#xff1a;css的文件体积和复杂度不可控#xff1b;增加了调试难度和成本 常用…sass的优缺点 优点css预处理器为css增加一些编程的特性无需考虑浏览器的兼容性问题。支持嵌套、变量和逻辑等。可以让css更加简介、提高代码复用性、逻辑分明等等。 缺点css的文件体积和复杂度不可控增加了调试难度和成本 常用的知识点
1、注释
/*
多行
*/
//单行
/*! 不会被压缩*/2、变量 会有作用域的限制
$color: red; //在值的后边加global会变为全局属性3、模板字符串
#{变量}4、import 引入文件 支持同时导入多个文件使用逗号隔开即可 以下情况会导致文件仅作为普通css语句不会导入任何Sass文件 文件拓展名是.css文件名以http://开头文件名是url()import包含media queries 5、继承 extend
.a{
width:100px;
height:100px;
}
.b{
extend .a;
}6、if的使用
p{if 112{color:red;}
}p{if 112{color:red;}else{color:blue}
}7、 循环语句 for 语法 for $var from start through end 或 for $var from start to end through和to的相同点与不同点? 相同点都包含start值 不同点through包含end值但to不包含end的值 for $I from 1 through 3{.item-#{$I}{ width: 2em * $i; }
}
//等价于
.item-1{width:2em;
}
.item-2{width:4em;
}
.item-3{width:6em;
}8、循环语句 while 语法 while experssin 指令重复输出格式直到表达式返回结果为false。这样可以实现比for更复杂的循环只是很少会用到 $1: 6;
while $10{.item-#{$i} { width : 2rem * $1; }$1: $1-2; //给i重新赋值
}
//等价于
.item-6{width: 12em;
}
.item-4{width: 8em;
}
.item-2{width: 4em;
}
