zoukankan      html  css  js  c++  java
  • CSS选择器

    CSS三大特性—— 继承、 优先级和层叠。

    继承:即子类元素继承父类的样式;

    优先级:是指不同类别样式的权重比较;

    层叠:是说当数量相同时,通过层叠(后者覆盖前者)的样式。

    css选择符分类  

    首先来看一下css选择符(css选择器)有哪些?


      1.标签选择器(如:body,div,p,ul,li)

      2.类选择器(如:class="head",class="head_logo")

      3.ID选择器(如:id="name",id="name_txt")

      4.全局选择器(如:*号)

      5.组合选择器(如:.head .head_logo,注意两选择器用空格键分开)

      6.后代选择器 (如:#head .nav ul li 从父集到子孙集的选择器)

      7.群组选择器 div,span,img {color:Red} 即具有相同样式的标签分组显示

      8.继承选择器(如:div p,注意两选择器用空格键分开)

      9.伪类选择器(如:就是链接样式,a元素的伪类,4种不同的状态:link、visited、active、hover。)

      10.字符串匹配的属性选择符(^ $ *三种,分别对应开始、结尾、包含)

      11.子选择器 (如:div>p ,带大于号>)

      12.CSS 相邻兄弟选择器器 (如:h1+p,带加号+)

    css优先级

    当两个规则都作用到了同一个html元素上时,如果定义的属性有冲突,那么应该用谁的值的,CSS有一套优先级的定义。

    不同级别

    1. 在属性后面使用 !important 会覆盖页面内任何位置定义的元素样式。
    2. 作为style属性写在元素内的样式
    3. id选择器
    4. 类选择器
    5. 标签选择器
    6. 通配符选择器
    7. 浏览器自定义或继承

          总结排序:!important > 行内样式>ID选择器 > 类选择器 > 标签 > 通配符 > 继承 > 浏览器默认属性

    权重

    !important      infinity

    行间样式       1000

    id           100

    class |属性|伪类    10

    标签|伪元素     1

    通配符        0

    权重是256进制


         

  • 相关阅读:
    LeetCode 83. Remove Duplicates from Sorted List (从有序链表中去除重复项)
    LeetCode 21. Merge Two Sorted Lists (合并两个有序链表)
    LeetCode 720. Longest Word in Dictionary (字典里最长的单词)
    LeetCode 690. Employee Importance (职员的重要值)
    LeetCode 645. Set Mismatch (集合不匹配)
    LeetCode 500. Keyboard Row (键盘行)
    LeetCode 463. Island Perimeter (岛的周长)
    115.Distinct Subsequences
    55.Jump Game
    124.Binary Tree Maximum Path Sum
  • 原文地址:https://www.cnblogs.com/guxia/p/9462827.html
Copyright © 2011-2022 走看看