• CSS选择器的优先级


    选择器的优先级 从高到低依次是:

    1.在属性后面使用 !important会覆盖页面内任何位置定义的元素样式

    2.作为style属性写在元素标签上的内联样式

    3.id选择器

    4.类选择器

    5.伪类选择器

    6.属性选择器

    7.标签选择器

    8.通配符选择器

    9.浏览器自定义

    实际上,同一个元素可以使用多个规则来指定它的字体颜色,每个规则都有自己的选择器。显然最终只有一个规则起作用(不可能一个字既是红色又是绿色),那么该规则的特殊性最高,特殊性即css优先级。那么CSS的优先级怎么计算呢? 选择器的特殊性值表述为4个部分,用0,0,0,0表示。 ID选择器的特殊性值,加0,1,0,0; 类选择器、属性选择器或伪类,加0,0,1,0; 元素和伪元素,加0,0,0,1; 通配选择器对特殊性没有贡献,即0,0,0,0; 最后比较特殊的一个标志!important(权重),它没有特殊值,但是他的优先级是最高的,为了方便记忆,可认为他的默认值是1,0,0,0.

    id选择器:#test

    类选择器:.test

    伪类选择器: :link :visited :hover :active,:nth-child() :nth-of-type() :focus

    属性选择器: input[type='file']

    元素选择器:p、a、div

    伪元素选择器: :fisrt-letter  :first-line  :before  :after

    分组选择器: ,

    后代选择器: div p;

    子元素选择器:div>p;

    相邻兄弟选择器:div+p;

                                                                                                                                                                                                                                                                                            

  • 相关阅读:
    python 学习笔记(四)(流程控制)
    python 写斐波那契数列
    python 部分术语对照表
    python 学习笔记(三)(对前两节的补充)
    python # -*- coding: utf-8 -*-
    写出更好的 JavaScript 条件语句
    PHP消息队列实现及应用
    VUE3.0 路由去掉#号
    php设计模式
    workerman 可能需要用到的函数
  • 原文地址:https://www.cnblogs.com/pfr-blog/p/7489509.html
Copyright © 2020-2023  润新知