• 07.css学习-css选择器


    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <style type="text/css">
    /*
    选择器: 选择器的作用就是找到对应的数据进行样式化。

    1.标签选择器: 就是找到所有指定的标签进行样式化。

    格式:
    标签名{
    样式1;样式2....
    }

    例子:
    div{
    color:#F00;
    font-size:24px;
    }
    2. 类选择器: 使用类选择器首先要给html标签指定对应的class属性值。

    格式:
    .class的属性值{
    样式1;样式2...
    }

    例子:
    .two{
    background-color:#0F0;
    color:#F00;
    font-size:24px;
    }


    类选择器要注意的事项:
    1. html元素的class属性值一定不能以数字开头.
    2. 类选择器的样式是要优先于标签选择器的样式。


    3. ID选择器: 使用ID选择器首先要给html元素添加一个id的属性值。

    ID选择器的格式:

    #id属性值{
    样式1;样式2...
    }
    id选择器要注意的事项:
    1. ID选择器的样式优先级是最高的,优先于类选择器与标签选择器。
    2. ID的属性值也是不能以数字开头的。
    3. ID的属性值在一个html页面中只能出现一次。

    4. 交集选择器: 就是对选择器1中的选择器2里面的数据进行样式化。


    选择器1 选择器2{
    样式1,样式2....
    }

    例子:
    .two span{
    background-color:#999;
    font-size:24px;
    }


    5. 并集选择器: 对指定的选择器进行统一的样式化。

    格式:
    选择器1,选择器2..{
    样式1;样式2...
    }

    span,a{
    border-style:solid;
    border-color:#F00;
    }
    6. 通过选择器:

    *{
    样式1;样式2...
    }


    */

    *{
    text-decoration:line-through;
    background-color:#CCC;
    }

    </style>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    </head>
    <body>
    <div id="one" class="two">这个是<span>第一个div标签</span>...</div>
    <div id="one" class="two">这个是<span>第二个div标签</span>...</div>
    <span>这个是一个span标签</span><br/>
    <a class="two" href="#">新闻标题</a>

    </body>
    </html>

  • 相关阅读:
    【算法】哈希表法四部曲
    【算法】位运算技巧
    【算法】分治法四步走
    【算法】分支界限三步走
    【Java】位操作符
    【Java】String字符串格式化
    阿里一面,给了几条SQL,问需要执行几次树搜索操作?
    c++随机数问题研究
    Google单元测试框架gtest之官方sample笔记4--事件监控之内存泄漏测试
    Google单元测试框架gtest之官方sample笔记3--值参数化测试
  • 原文地址:https://www.cnblogs.com/transcendent/p/4948400.html
Copyright © 2020-2023  润新知