通配选择符（*）

          选定所有对象

  • 通配选择符(Universal Selector)
  • 通常不建议使用通配选择符，因为它会遍历并命中文档中所有的元素，出于性能考虑，需酌情使用
<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <style type="text/css">

            *{

                color: #FF0000;

                font-weight: bold;

            }

        </style>

    </head>

    <body>

        <div>

            <p>第一个段落。</p>

            <p>第二个段落。</p>

            <ul>

                <li>Java</li>

                <li>C#</li>

            </ul>

        </div>

    </body>

</html>

   类型选择符（Element）

          以文档语言对象类型作为选择符

  • 类型选择符(Type Selector)
<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <style type="text/css">

            p{

                color: #FF0000;

                font-weight: bold;

            }

        </style>

    </head>

    <body>

        <div>

            <p>第一个段落。</p>

            <p>第二个段落。</p>

            <ul>

                <li>Java</li>

                <li>C#</li>

            </ul>

        </div>

    </body>

</html>

   ID选择符（Element#ID）

          以唯一标识符id属性等于myid的E对象作为选择符

  • ID选择符(ID Selector)
<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <style type="text/css">

            #language{

                color: #FF0000;

                font-weight: bold;

            }

        </style>

    </head>

    <body>

        <div>

            <p>第一个段落。</p>

            <p>第二个段落。</p>

            <ul id="language">

                <li>Java</li>

                <li>C#</li>

            </ul>

        </div>

    </body>

</html>

   类选择符（Element.class）

          以class属性包含myclass的E对象作为选择符

  • 类选择符(Class Selector)
  • 不同于ID选择符的唯一性，类选择符可以同时定义多个
<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <style type="text/css">

            .a{

                color: #0000FF;

            }

            .b{

                font-weight:bold;

                font-size: x-large;

            }

        </style>

    </head>

    <body>

        <div>

            <p>第一个段落。</p>

            <p>第二个段落。</p>

            <ul class="a b">

                <li>Java</li>

                <li>C#</li>

            </ul>

        </div>

    </body>

</html>

CSS选择符-----元素选择符的更多相关文章

  1. CSS全览_选择符+特指+单位+字体

    CSS全览_选择符+特指+单位+字体 目录 CSS全览_选择符+特指+单位+字体 1. CSS样式 2. 选择符 3. 特指度和层叠 4. 值和单位 5. 字体 作者: https://www.cnb ...

  2. CSS基础篇之选择符

    关系选择符 E F 包含选择符(Descendant combinator) CSS1 选择所有被E元素包含的F元素. <html> <head> <meta chars ...

  3. CSS选择符-----关系选择符

       包含选择符(E F)           选择所有被E元素包含的F元素 与 子选择符(E>F) 不同的是,包含选择符将会命中所有符合条件的后代,包括儿子,孙子,孙子的孙子... <! ...

  4. CSS基础篇之选择符2

    属性选择符: 选择符 版本 描述 E[att] CSS2 选择具有att属性的E元素. E[att="val"] CSS2 选择具有att属性且属性值等于val的E元素. E[at ...

  5. JQuery元素选择

    1.基本元素选择器 $(“p”) //选取<p>元素 $(“p.info”) //选取所有class=”info”的<p>元素 $(“p#demo”) //选取id=”demo ...

  6. CSS基本知识2-CSS选择

    选择就是CSS定义的第一部分,可以用面向对象的模式来理解,或者声明式的面向对象. 标准选择: #.E 进阶选择:“,”分隔多个相同项,相当于类的实例. 如:#btn1,#btn2,.btn {...} ...

  7. jq选择子元素

    jq选择子元素 一.获取父级元素 1. parent([expr]): 获取指定元素的所有父级元素 <div id="par_div"><a id="h ...

  8. Web自动化 - 选择操作元素 2

    文章转自 白月黑羽教Python 前面我们看到了根据 id.class属性.tag名 选择元素. 如果我们要选择的 元素 没有id.class 属性, 这时候我们通常可以通过 CSS selector ...

  9. 清除display:inline-block元素换行符间隙font-size:0;

    font-size:0; 清除display:inline-block元素换行符间隙 看例子: css: .dd {background-color: #ddd;} .dd2 {background- ...

随机推荐

  1. 《mongoDB》基本操作-创建/更新/删除文档

    一:基本操作 - db; 当前选择的集合(等于数据库名) > db demo -  use db_name; 选择你要操作的集合 > use demo switched to db dem ...

  2. Django2.0跨域请求配置

    跨域:通过js或python在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(Django)的数据.只要协议.域名.端口有任何一个不同,都被 ...

  3. Swift中＂#＂的用法

    配置外部参数名 在函数(或者方法)的参数名前添加"#",可以使该参数拥有相同的本地参数名和外部参数名. 注:在方法中,第二个及后续的参数,默认是具有和内部参数一致的外部参数名的,只 ...

  4. 转载：caffe中的Reshape层

    http://blog.csdn.net/terrenceyuu/article/details/76228317 #作用:在不改变数据的情况下,改变输入的维度 layer { name: " ...

  5. 【托业】【新托业TOEIC新题型真题】学习笔记2-题库一-->P5-6

    P5-6 --------------------------------------单词-------------------------------------- transfrom 转化 jus ...

  6. 测试：fiddler使用

    Fiddler是个很强大的工具,很多新人可能不知道怎么用. 直接下载安装,然后打开电脑端的Fiddler,点击Tools > Fiddler Options,勾选上 Allow remote c ...

  7. Centos7之Systemd风格

    Unit(单元) /usr/lib/systemd/system       每个服务最主要的启动脚本设置,类似于之前的/etc/init.d目录 关键特性 1.基于socket的激活机制,socke ...

  8. vue-watch监听路由的变化

  9. Linux学习笔记：常用100条命令（三）

    linux常用命令 1.查看当前yum源 yum list 2.查看电脑以及操作系统的相关信息 uname -a 3.查看当前版本信息 cat /proc/version 4.查看发行版本信息 cat ...

  10. 一个简单的MapReduce示例（多个MapReduce任务处理）

    一.需求 有一个列表,只有两列:id.pro,记录了id与pro的对应关系,但是在同一个id下,pro有可能是重复的. 现在需要写一个程序,统计一下每个id下有多少个不重复的pro. 为了写一个完整的 ...