2020.8.24+王杉

学习内容：

1. 五大浏览器及其内核:

   • chrome webkit → blink
   • opera presto → webkit → blink
   • firefox gecko
   • IE trident
   • safari webkit

   2.link 和 import的区别：①link是xhtml标签，而@import是css提供的

​ ②link是写在html页面上的只能存在于head部分，而@import是写在css文件中，可以写在style中。

​ ③link引用css是页面加载时同时加载，而@import是需要页面加载完成载入后才加载。

​ ④兼容性：link是标签没有兼容问题，@import css 2.1提出，低于IE5及以下下的IE不支持。

​ ⑤link支持使用javascript去控制DOM改变样式，但是@import不支持。

​ ⑥link方式引入权值高于@import的权重。

• sass：sass是强化css的辅助工具，在css的基础上加强的很多许多高级功能，类似于css+JavaScript的结合体。
  • scss文件转换成css文件：scss是sass的文件后缀，转换可以进行单文件的转换 多文件的转换 单文件监听（每次1保存自动进行转换） 多文件监听（多个文件的转换）。
  • 注释：多行注释会被转换到css文件（/**/） 单行不会（//）
  • 变量：$变量名：值；（可以反复使用 命名规则和选择器一致）作用域 旨在最近的｛｝中有效 变量名重复时使用 !default前面有重复名字的变量这个使用的就用前面的变量 (前面没有就使用这个变量).
  • 嵌套：结构嵌套、群组嵌套、属性嵌套。
  • 导入：局部导入css文件，全局导入css文件。
  • 混合器：使用@mixin+混合器名称+形参 使用@include+混合器名称+实参调用。
  • 继承：@extend 需要集成的选择器并继承其属性。
  • 运算：主要是简单的四则运算 + - * / 插值操作：#{}大括号里面写值 颜色运算：属性一一对应进行相应的运算。
  • 函数：数学函数 字符串函数 自定义函数（根据自己需求自己写）。
  • 指令：
  • if-else指令：if到else-if...最后到else不同的情况下执行对应不同的结果。
  • for指令：@for \(i from startNumber to endNumber{}和@for \)i from startNumber through endNumber{} 区别to是不包括最后一个 through是包括全部。
  • each指令：@each $i in 选择器{}。

心得：

​ 今天把昨天做的试卷给讲解了，有些不懂的听懂了，还有些没有写全的也补充了，然后就是要好好刷刷面试题，不然就差的的太多了，毕竟要好好准备面试那一关，然后就是今天讲的sass基本上听懂了，练习还是会写的，就是实际用可能要自己多去试试。