发表于: 2018-11-24 20:59:51
1 815
今天完成的事:继续任务十四----十五
明天计划的事:继续任务 十四 十五 编写布局。
遇到的问题: 刚开始对 循环语句的知识 理解不了 。
解决办法:查了下相关的资料 做几个demo。
收获:
sass的@if用not,or,and分别表示非,或,与。
sass用==,!=分别表示等于与不等于。
@for
for循环有两种形式,分别为:@for $var from through 和@for $var from to 。
在两种形式之下,$var都可以是任意的变量名。在通常的习惯中,一般都将$var命名为$i来做变量名,用于@for指令的递增或递减。
$i表示变量,start表示起始值,end表示结束值,这两个的区别是关键字through表示包括end这个数,而to则不包括end这个数。先来个简单的:
CSS编译代码
@whild
指令也需要SassScript表达式(像其他指令一样),并且会生成不同的样式块,直到表达式值为false时停止循环。这个和@for指令很相似,只要@while后面的条件为true就会执行。
CSS编译代码
@each
@each 指令的格式是 $var in <list>, $var 可以是任何变量名,比如 $length 或者 $name,而 <list> 是一连串的值,也就是值列表。@each 将变量 $var 作用于值列表中的每一个项目,然后输出结果,如下:
CSS编译代码
、
@each 利用变量多重赋值
CSS编译代码
评论