zoukankan      html  css  js  c++  java
  • CSS的继承性和层叠性

    继承性

    CSS的一个主要特征就是继承,它是依赖于祖先-后代的关系的。继承是一种机制,它允许样式不仅可以应用于某个特定的元素,还可以应用于它的后代。

    哪些属性能继承?color、 text-开头的、line-开头的、font-开头的。
    这些关于文字样式的,都能够继承; 所有关于盒子的、定位的、布局的属性都不能继承。

    层叠性

    层叠性:就是CSS处理冲突的能力。 所有的权重计算,没有任何兼容问题!

    当选择器,选择上了某个元素的时候,那么要这么统计权重:

    id的数量,类的数量,标签的数量

        <style type="text/css">
            #box1 .box2 p { /*权重:111*/
                color: red;
            }
            div div #box3 p { /*权重:103*/
                color: blue;
            }
            div.box1 div.box2 div.box3 p { /*权重:34*/
                color: pink;
            }
        </style>
    

    255个标签等于1个类名(可以进位,但是没有实战意义)

    总结:

    如果权重一样,那么以后出现选择器的为准。
    如果不能直接选中某个元素,通过继承性影响的话,那么权重是0。
    如果大家都是0,那么有一个就近原则:谁描述的近,听谁的。

    权重问题

    同一个标签,携带了多个类名,有冲突:

        <p class="spec1 spec2">我是什么颜色?</p>
        <p class="spec2 spec1">我是什么颜色?</p>
    

    和在标签中的挂类名的书序无关,只和css的顺序有关:

        spec2{
            color:blue;
        }
        .spec1{
            color:red;
        }
    

    所以是红色的。

    !important标记

        <style type="text/css">
            p{
                color:red !important;
            }
        </style>
    

    来给一个属性提高权重。这个属性的权重就是无穷大。

    !important无法提升继承的权重,该是0还是0
    !important不影响就近原则
    !important做站的时候,不允许使用。因为会让css写的很乱。

  • 相关阅读:
    JavaBean 与 EJB 的区别
    MFC选项卡的实现
    MFC的图片按钮
    windows 下使用 MinGW + msys 编译 ffmpeg
    在windows使用vs2008编译live555
    C89 和 C99 标准比较
    11.求二元查找树的镜像[MirrorOfBST]
    10.排序数组中和为给定值的两个数字[Find2NumbersWithGivenSum]
    9.链表中倒数第k个结点[FindReverseKthLinkedListNode]
    8.另类方法求1+2+...+n[AnotherMethodOfCalculateSumN]
  • 原文地址:https://www.cnblogs.com/lland/p/6360397.html
Copyright © 2011-2022 走看看