发表于: 2017-04-08 23:48:55
1 628
今天做了什么: 做完了任务12和任务13
明天要做什么: 任务十四和任务十五
今天遇到的问题:
1.关于sass的混合宏:今天get到了一个新的点,可以把上一个混合宏的结果用在下一个混合宏里,例如
@mixin box ($height,$size,$color,$bgc) {
@include flex (center);
height: $height;
font-size: $size;
text-align: center;
color: $color;
background-color: $bgc;
}
2.关于在sass里面使用媒体查询
一开始我是想直接用css的媒体查询,但是会失效,一开始我在想是不是我使用媒体查询的class被我放在混合宏里面,查不到。我就将此属性把class从混合宏里面拿出来,但是还是查不到。后来师兄@李维文指出是因为没有把媒体查询放在他的上一级class里,在sass编译的时候就不会添加上级class,导致找不到这个class。可能我说的比较混乱=。=
然后无良师兄@李维文(>.<)让我用sass的媒体查询写(╯‵□′)╯︵┻━┻,查了一波,(。・∀・)ノ゙嗨呀好难啊,抄了代码,但是师兄毕竟还是师兄,就给我解释了一下这个是怎么用的:
首先设置一个变量作为断点
然后在混合宏里面写
$query: map-get($breakpoints, $breakpoint);
@if not $query {
@error 'No value found for `#{$breakpoint}`. Please make sure it is defined in `$breakpoints` map.';
}
@media #{if(type-of($query) == 'string', unquote($query), inspect($query))} {
@content;
}
查询断点,如果没有查到,就报错;查到了,就在这个类里面添加属性值。然后用@include吧之前的值覆盖掉,实现媒体查询。
今天的感悟:跟一个gay里gay气的人打赌,我要在两天之内做完14和15,赢饭的,我浑身300多斤的肉都兴奋起来了!
评论