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

    W3School离线手册(2017.03.11版)下载:https://pan.baidu.com/s/1c6cUPE7jC45mmwMfM6598A

    选择符指的是要修改的元素。CSS中常用的选择符有 HTML选择器、类选择器、id选择器

    HTML选择器

    最常见的 CSS 选择器是元素选择器。换句话说,文档的元素就是最基本的选择器。

    如果设置 HTML 的样式,选择器通常将是某个 HTML 元素,比如 p、h1、em、a,甚至可以是 html 本身。

    例如:

    html {color:black;}
    h1 {color:blue;}
    h2 {color:silver;}

    可以将某个样式从一个元素切换到另一个元素。

    假设您决定将上面的段落文本(而不是 h1 元素)设置为灰色。只需要把 h1 选择器改为 p。

    html {color:black;}
    p {color:gray;}
    h2 {color:silver;}





    类选择器

    在 W3C 标准中,元素选择器又称为类型选择器(type selector)。

    “类型选择器匹配文档语言元素类型的名称。类型选择器匹配文档树中该元素类型的每一个实例。”

    格式如下:

      selector.classname{

        property1:valu;

        property2:valu;

        ……

      }

    例如:

    p.left {font-family: sans-serif;}

    id选择器

    当需要为某个元素单独设计样式时,可以使用id选择器,使用id选择器要先为设计样式的对象定义一个id值.id选择器是唯一的,不同元素的id值是不能重复的。

    例子:

    <div id="top"></div>

    定义top的样式:

    #top{

      property1:value;

      property2:value;

      ……

    }

    html

    <!DOCTYPE html>
    <html >
    <head>
        <meta charset="UTF-8">
        <title>CSS 常用选择器</title>
        <link rel="stylesheet" type="text/css" href="0923.css">
    </head>
    <body>
    
        <!--
         id 选择器
            -通过id属性值选中唯一的元素
            - #id属性名{}
    
    
         class 类选择器
            -通过类选择器,选中一组
            -.class属性名{}
    
        -->
        <h1>HTML选择器</h1>
        <p id="p1">css test</p>
        <p class="p2">css test</p>
        <p class="p2">css test</p>
        <p class="p2">css test</p>
    
    
    
    </body>
    </html>

    0923.css

    h1{
        color: yellow;
    }
    
    #p1{
        color: aqua;
        font-size: 20px;
    }
    .p2{
          color: red;
          font-size:40px;
      }

    特此声明:如需转载请注明出处,如有疑问请及时提出以便于改正,如有侵权,联系删除,谢谢

  • 相关阅读:
    计算机网络(1)----概述
    博客园自定义样式
    linux进程
    接口回调解析
    优先级队列
    双栈实现队列
    递归解决反转链表的一部分
    Multisim 之逻辑转换仪
    Multisim 如何添加文本 如何编辑文本字体
    Multisim 中的一些快捷键
  • 原文地址:https://www.cnblogs.com/CGWTQ/p/9782748.html
Copyright © 2011-2022 走看看