zoukankan      html  css  js  c++  java
  • 伪类名称的由来

     1 <style>
     2         td:first-child{
     3             background-color: red;
     4         }
     5     </style>
     6 </head>
     7 <body>
     8     <table>
     9         <tr>
    10             <th>name</th>
    11             <th>age</th>
    12             <th>num</th>
    13         </tr>
    14         <tr>
    15             <td>dawa</td>
    16             <td>5</td>
    17             <td>1</td>       
    18         </tr>
    19         <tr>
    20             <td>erwa</td>
    21             <td>5</td>
    22             <td>2</td>
    23         </tr>
    24     </table>
    25 </body>

    :first-child

    此字符串就是“寻常意义”上的一种伪类选择器。

    想象一下,现在有一个表格,形状如下:

     每一行有三个单元格,如果想让“每一行的第一个单元格”的背景色变为红色,可以使用:first-child。

    把此字符串想象成一个技能,使用这个技能就能完成我们的心愿,那我们此时的心愿到底是什么?

    选择有“某种特征”的元素。这个特征可以是“某元素的第一个子元素”,“某元素的最后一个子元素”,当然这是从“位置”上来说的。

    整个html文档就像一棵树,层次分明,各个元素之间有着联系。

    在上面代码中,想让每一行的第一个单元格的背景色变为红色。

    这样的单元格不只有一个,而是可以有很多,所以最终选择了多个事物。

    事物a,b,c,每一个事物都有很多特征,它们之间有相同点,有不同点。

    就像是葫芦娃们,大娃和二娃的技能不一样,但它们头上都有一个小葫芦,挺好看。

    依据某些特征来对一群事物分类,是人类常常做的事情。比如水果,蔬菜,肉等等,事物之间大同小异。

    在此处,一些元素具有某些相同的特征,比如说:咱们都是父元素的第一个儿子。通过这个特征,就能找到一大批元素,这些元素就构成了“类”。

    伪类?

    很多人理解为“假的类”,“虚构的类”,这是错误的。因为这些元素的的确确被分类了,分类完成是一个既成事实,可不是虚构的。

    思考一下,类选择器为什么就是“真的类”?真假的标准是什么?

    定义这些概念的人,把“是否在明面上书写”作为真假的标准。

    他们在说:看啊,class="name",这就是真的类啊,因为这是明面上被写出来的。

    而“a作为b的第一个子元素”这个分类标准没写出来啊,存在于程序员的脑海之中,当然是假的。

    但事实是,当我们写下:first-child这个字符串时,就已经把分类标准写出来了,为什么还是假的?
    不能因为把x叫做真类,就把y叫做伪类。这太耍流氓了。

    综上所述,此处“伪类”的定义并不成立。

    元素与元素之间有相同的特征,所以构成了类:

    某元素的第一个子元素,这是一类,

    某元素的最后一个子元素,这也是一类。

    类与类之间有相同的特征(没写成class那样),所以构成了伪类。

  • 相关阅读:
    for 循环遍历字典中的键值两种方法
    python print函数之end
    python中的lambda匿名函数和reduce、filter、map函数
    python2.7 python3.3 cmd命令行 运行同一段代码内存地址为什么不一样?而用同一个解释器运行的内存地址都一样
    Eclipse快捷键
    Sass基础(二)
    Sass基础(一)
    浅谈JavaScript原型
    浅谈Javascript闭包
    Bootstrap学习笔记(四)
  • 原文地址:https://www.cnblogs.com/flyover/p/14231750.html
Copyright © 2011-2022 走看看