前端入门学习笔记4

好吧，我承认今天划水了，原本想今天把CSS有关知识全部过一遍，但是emmmmm，算了，先把今天所学的总结一下吧。

今天没有进行实地操作，一直在看相关知识点，接着昨天的选择器开始继续总结。

伪选择器：

1.伪类（Pseudo-class）

一个css伪类是以：开头，添加到选择器末尾的一个关键字，可以使样式在特定状态下呈现，比如鼠标悬停时文字变色等。

2.伪元素（Pseudo-element）

和伪类有点类似，但是是以：：开头。

具体的每一个伪类和伪元素的作用可以在这里查询https://developer.mozilla.org/zh-CN/docs/Web/CSS/Reference#%E5%85%B3%E9%94%AE%E5%AD%97%E7%B4%A2%E5%BC%95

组合器和多重选择器，顾名思义就是讲多个选择器结合起来，规则如下：

然后就是CSS中的数值和单位，对于尺寸大小有px，em,rem,百分比等，对于颜色有关键字，十六进制，rgb,hsl等。

px就是像素值，16px代表文字大小为16个像素的大小，是绝对值，不会随着盒子的大小而改变，em是以父元素字体大小为比例，例如父元素字体大小为16px，若设置子元素字体大小为2em，实际字体大小为32px，rem和em类似，只不过是以根元素字体大小作参考。

颜色中有些关键字可以代替颜色，例如black就是黑色，red就是红色（color:black）。同时颜色也可以用十六进制表示，例如color:#707070。也可以用rgb值，color:rgb(255,255,0)，我个人觉得这种表现方式更直观，另外还有一个rgba，a是代表透明度，范围是0-1。HSL的意思是表示色度，饱和度，亮度，色度的范围是0-360，饱和度和亮度的范围是0%到100%，同样也有HSLA，A代表透明度。HSL可以可视化为一个颜色柱，理解起来更直观。

圆柱体的柱面代表色度，半径代表饱和度，高代表亮度。

然后有一个重点就是，选择器之间的优先级，ID选择器大于类选择器，属性选择器，伪类大于元素选择器，伪元素。同层次之间，按照次序覆盖前面的属性。

对于各个组合选择器和多重选择器的优先级，有一种计算方式。

如若在属性值后添加! important，那么这个属性则会变得无比重要，不会被别的规则中的属性覆盖，除非有比当前选择器更高级的选择器的规则属性中又添加了此语句。

今天就这样吧，明天将要学习CSS排版，划水自重hhhhh。