zoukankan      html  css  js  c++  java
  • CSS选择符归类

    一、css样式表的权重关系:

    1)内联样式表的优先级别最高;

    2)内部样式表与外部样式表的优先级和书写的顺序有关,后书写的优先级别高;

    3)同在一个样式表中的优先级和书写的顺序也有关,后书写的优先级别高。(被覆盖的只是相同属性的样式)。

    二、选择符:

    1)类型选择符(标签选择符)

       ①所有的html标签可以直接当作选择符进行应用。

       ②特点:能选中当前结构里面全部同名标签。

       ③应用:想统一某一个标签样式的时候或者是清除某个标签默认样式的时候。

    2)id选择符:       

        ①语法:

        ·格式:<标签 id="名称"></标签>

        ·用法:#名称{ 属性:属性值 }   

        ②特点:唯一性!在同一个页面里面,一个id名只能用一次。

        ③应用:来划分网页外围结构

    3)类选择符(class选择符)

        ①语法:

          ·格式:<标签 class="名称1 名称2 名称3 名称4..."></标签>

          ·用法 :.名称{属性:属性值;}

        ②特点:

           a:一个元素可以有多个类名,类名可以重复出现

           b:可以制定一类样式.

    4)群组选择符:

       ①语法:以逗号分隔的方式,把多个选择器组成一组,给整组添加样式.

       ·选择符1,选择符2,选择符3,选择符4{ 属性:属性值; }

       ·eg :     #box,.con,h3,#wrap{ 300px; }

    5)包含选择符(子代选择器后代选择符)( 通过父元素找子元素 )

       ① 语法:

             父元素 子元素{ 属性:属性值; }

    6) 伪类选择器:

        ① a:link {color: red;}                    /* 未访问的链接状态 */

        ②a:visited {color: green;} /* 已访问的链接状态 */

        ③a:hover {color: blue;}                  /* 鼠标滑过链接状态 */

        ④a:active {color: yellow;}               /* 鼠标按下去时的状态 */

    补:hover可以适用于所有标签

    7)通配符:

            ①*{  }

            ②* 选择页面中所有的元素!

            ③eg*{

                margin:0;    盒子外围间距清零

                padding:0;   盒子内部的距离清零

            }

  • 相关阅读:
    034.Python的__str__,__repr__,__bool__ ,__add__和__len__魔术方法
    033.Python的__del__析构方法he__call__方法
    032.Python魔术方法__new__和单态模式
    python3使用tabulate漂亮的打印数据
    在Linux真正有效的调节鼠标速度!
    RouterOS上实现内网DNS劫持
    使用grease monkey强力清除搜索结果页的广告
    centos 6.5 apache下配置python cgi 并解决中文乱码
    python的缩进语法不是一种好的设计
    让npm默认使用taobao镜像源
  • 原文地址:https://www.cnblogs.com/yh-3175339026/p/12601137.html
Copyright © 2011-2022 走看看