通配选择符（*）

          选定所有对象

  • 通配选择符(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. 《HTTP - http2.0》

    推荐一首歌 - <卡路里>火箭101 杨超越真的只唱了一句! PS: 这章主要讲述了在 HTTP 发展之后的,一些扩展协议和补充,也会在这个章节对这几种协议和补充做一个比较. 1:HTTP ...

  2. tensorflow入门笔记（二） 滑动平均模型

    tensorflow提供的tf.train.ExponentialMovingAverage 类利用指数衰减维持变量的滑动平均. 当训练模型的时候,保持训练参数的滑动平均是非常有益的.评估时使用取平均 ...

  3. 深入理解Java虚拟机笔记

    1. Java虚拟机所管理的内存 2. 对象创建过程 3. GC收集 4. HotSpot算法的实现 5. 垃圾收集器 6. 对象分配内存与回收细节 7. 类文件结构 8. 虚拟机类加载机制 9.类加 ...

  4. css自动换行如何设置?url太长会撑开页面

    我们更新文章时如果有引用其他文章一般会带一个原文url,但这个链接如果太长的话会把内容的版块撑开,整个排版乱了.那我们能不能设置css自动换行呢?如下图所示,其实只要两个样式就能搞定 word-wra ...

  5. 20190223 Hadoop生态圈，关于大数据

    周六参加了一场,大数据基础培训,讲得比较详细.培训的讲师对于互联网行业职位萎缩也有相对的解释,也还介绍了新的职位的诞生. 以前对于大数据的理解,就是超大的数据量,但对大数据开发不甚了解. 大数据平台的 ...

  6. javascript篇-typeof,instanceof,constructor,toString判断数据类型的用法和区别

    javascript基本数据类型有:string,number,Boolean,undefined,null 引用类型(复杂类型):object, ES6中新增了一种数据类型:Symbol 以上数据类 ...

  7. WebStrom2018注册码

    2RRJMBXW33-eyJsaWNlbnNlSWQiOiIyUlJKTUJYVzMzIiwibGljZW5zZWVOYW1lIjoi5b285bK4IHNvZnR3YXJlMiIsImFzc2lnb ...

  8. Python生态工具、文本处理和系统管理（虚拟）

    一.Python生态工具 一.Python内置小工具 1.秒级启动一个下载服务器 Python 内置了一个下载服务器就能够显著提升效率了 . 例如, 你的同事要让你传的文件位于某一个目录下,那么,你可 ...

  9. centos7安装Lua

    网官有介绍安装:http://www.lua.org/start.html 由于之前我遇到过致命错误并纪录在:https://blog.csdn.net/bingbingtea/article/det ...

  10. MySql语句常用命令整理---单表查询

    初始化t_employee表 创建t_employee表 -- DROP TABLE IF EXISTS test; CREATE TABLE t_employee ( _id INTEGER PRI ...