发表于: 2018-05-30 01:34:15

3 526


今天完成的事情:

完成任务十一

完成任务十二

开始任务十三

明天计划的事情

完成任务十三

遇到的问题:

#配置sass的问题,

按照sass官方给出的安装方法安装后,配置webstorm失败,重新以web官方给出的安装方案安装,配置成功。

#移动端a标签点击背景变色

解决办法:取消a标签在移动端点击时的蓝色

-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
-webkit-user-select: none;
-moz-user-focus: none;
-moz-user-select: none;

深度思考:

less 和sass区别: Syntactically Awesome Stylesheets(Sass)和Leaner CSS(LESS)都是CSS预处理器。它们是特殊的样式表扩展,使设计更容易,更高效。Sass和LESS都会编译成CSS样式表,以便浏览器读取它们,这是必不可少的一步,因为现代浏览器无法读取.sass或.less文件类型。

进入Web开发领域,那么熟悉两种预处理器之一或两者都是一个好主意。 ,两者都是相似的。他们使得CSS写得更简单,更面向对象,并且带来更愉快的体验。两种变体都达到了相同的结果 - 处理过的CSS 这两种语法都允许您编写变量,混合和缩进规则。 两者都可以使用Gulp和Grunt等任务运行器进行处理尽管如此,还是有一些关键的区别。其中五个在这里列出。

1 Sass在Ruby中。很少使用JavaScript

2 Sass有指南针,LESS有预启动

3分配变量:Sass使用$; LESS用@

4less有更少的用户友好文档

5 LESS比Sass有更好的错误信息

任务总结

任务名称:css-task11、task12

任务耗时: 1天

任务成果: http://www.jinjun.wiki/task/css/task11

任务脑图: 

任务总结: 通过任务了解了sass的使用,学习了代码规范,根据代码规范和sass重构代码, 通过使用变量能方便地统一修改一些公共的值如颜色/字体大小等,减少工作量;能将一些公共样式代码组织到一起实现复用,减少代码量。Sass 是 CSS 扩展,它使 CSS 的使用起来更加优雅和强大。

解决 了CSS 的缺陷,CSS 并不是一个完美的语言。CSS 虽然简单易学,却也能迅速制造严重的混淆,尤其是在工程浩大的项目中。

Sass 作为一种元语言,通过提供额外的功能和工具可以改善 CSS 的语法。同时,保留了 CSS 的原有特性。

Sass 存在的关键不是将 CSS 变成一种全功能编程语言,它只是想修复缺陷。正因如此,学习 Sass 如同学习 CSS 一样简单:它只在 CSS 的基础上添加了几个额外功能。



返回列表 返回列表
评论

    分享到