发表于: 2018-10-28 21:39:39
1 750
今天完成的事情:
任务五的重写
.vote{
background-image: url(../../img/task5.15.png);
height: ($five * 8);
background-repeat: no-repeat;
background-size: 101% 100%;
display: flex;
align-items: center;
.ink{
flex-direction: column;
margin-left: ($five / 2);
}
.woman{
width: ($five * 2.5);
height: ($five * 2.5);
margin-left: ($five / 2);
}
.name{
color: $three;
font-size: ($five / 1.33);
}
.icon{
flex-wrap: wrap;
}
}
任务六绝大部分的重写
.consult{
width: 100%;
height: ($five * 1.5);
background: $one;
@include layout;
.look{
margin-left: ($five / 2.22);
@include layout;
}
.employer{
width: ($five * 5);
height: ($five * 1.25);
line-height: ($five * 1.125);
font-size: 1.5rem;
border-radius: ($five / 5);
text-align: center;
color: $three;
background: $one;
}
明天计划的事情:明天计划提交任务十二,开始任务十三
遇到的问题:今天开始重写任务六的时候不是很理解,如何把fiex写进sass的变量里,看了教程感觉还是没什么头绪,就请教了师兄,经过师兄的指导解决了。
收获:为了有效的维护和开发项目,代码的重复利用就显得尤为重要。在Sass中,除了@import和@extend可以使你的代码更加具有重复利用性,@mixin指令也同样能提高你代码的重复使用率并简化你的代码。@extend指令通过继承从而简化了代码,但是它也有缺陷之处,首先是不够灵活,其次它还会将你不需要的其他地方具有相同类名的样式都继承过来。@mixin指令是另一种简化代码的方法。Mixins可以包含任意内容且可以传递参数,因此比'@extend'更加灵活和强大。
评论