入门教程:css入门学习

CSS的规则集,其同时也是CSS层叠样式表的基本组成部分

选择器 {
	属性 : 属性值;
}

CSS注释格式:/* 我是一条CSS注释 */

CSS的加载过程

rendering.svg

层叠、优先级和继承

CSS中当多个样式应用于同一元素,有时就会出现冲突,出现冲突后,CSS会根据一些规则来决定最终应用那个样式,规则如下:

  1. 层叠样式,同种优先级的样式,后面的可以覆盖前面的,此种操作称为层叠。
  2. 优先级,可以简单理解为一个衡量选择器具体选择哪些区域的尺度,
    1. 通常来说,选择器所选择的元素范围越大、越不具体,其本身的优先级就越低,要是选择器的选择范围越小、越具体它的优先级就会高一些。
    2. 优先级的具体规则
      1. 不同类型的选择器具有不同的权重分值,根据各个选择器的权重分值来进行优先级的划分,
      2. 内联样式的权重为千位,id选择器权重为百位、类选择器权重为十位、元素选择器权重为个位,0-0-0-0
      3. 若选择器列表中存在多个选择器,则同权重位的相加即为选择器列表的最终权重值,组合符和通用选择符不影响优先级
      4. 比较方式为从高位开始比较,高位相同才会向后比较,分数越大的优先级越高
      5. !important 能够覆盖之前的优先级规则,优先显示被此声明标注的属性,想要覆盖!important的方法就是使用另一个!important且顺序靠后的规则。

继承

父元素的一些属性是可以被后代元素继承的,但不是所有属性都可以被子元素继承,继承后在子元素中也会有父元素的相同属性,除非再手动对子元素指定属性。

可以通过控制继承属性可以操作元素是否开启继承。

CSS类选择器

基本选择器

标签选择器:通过html的标签进行选择,所有的标签都可以选择。

ID选择器:通过元素的ID属性来选择特定元素。格式:#id名{}

类选择器:通过元素的class属性来选择元素。格式:.类名{} ****