No.3理解CSS | 青训营

76 阅读1分钟

选择器优先级(特异度)

选择器的特异度分为三种:id,伪类,标签。其中优先级为行内样式>ID>类>标签

自己实践的感想

之前在做一个关于体验币自动兑换皮肤碎片的脚本的时候,找了好久就是无法定位那个元素,有六种可以兑换的东西,然后我只能定位那六个东西,不能定位到第三个也就是皮肤碎片,然后我的脚本也就告吹了,现在细细一想,CSS的部分出问题了,选择器没学会啊。

继承

定义:某些属性会自动继承其父元素的计算值,除非显示指定一个值。

看法

我想起了Javascript里面有好多这种继承啊,CSS里面,js里面,Vue里面,好多。不过整体思想应该是一样的吧。有父子关系,也有派生选择器的继承,和显式继承。

CSS处理过程

image.png

image.png 这个图好厉害啊,分为了filtering,检测,层叠,计算,绘制和重排。这个过程得好好消化一下,不然吸收不了。

布局(layout)

  1. 确定内容的大小和位置的算法
  2. 依据元素、容器、兄弟节点和内容等信息来计算

布局相关技术

常规流中有行级,块级,表格布局,FlexBox,grid布局,独立于常规流外有浮动和绝对定位,视频挑选了FLexBox进行了详细讲解。 详情参考developer.mozilla.org/zh-CN/docs/…

学习CSS建议

充分查阅MDN并且持续了解 保持充足好奇心和动力,自律(这个最难)。