1、id选择器

一对一关系

<div id="only">123</div>

#only{

background-color:black;

}

2、class选择器

多对多关系

<div class="demo1 demo2">123</div>

.demo1{

}

.demo2{

}

3、标签选择器

<div>123</div>

<div>456</div>

div{

background-color:black;

}

4、通配符选择器

<span>123</span>

<div>234</div>

<strong>1111</strong>

*{

background-color:green;

}

5、属性选择器

<div id="only" class="demo">123</div>

[id]{

}

[class]{

}

[id="only"]{

}

6、标签选择器优先级

!important>行间样式>id>class=属性选择器>标签选择器>通配符选择器

7、css权重(重点)

!important           Infinity(正无穷)

行间样式            1000    //这些数值是256进制

id                         100

class|属性|伪类    10

标签|伪元素           1

通配符                    0

<div style="background-color:red;">123</div>

div{

background-color:green;!important

}

HTML(二)选择器的更多相关文章

  1. CSS 学习路线(二)选择器

    选择器 规则结构: 分两个基本部分 选择器(selector)和声明块(declaration block) 组成 声明块:由一个或多个声明组成,每一个声明都是属性-值对 选择器分为:元素选择器,类选 ...

  2. 非常easy学习的JQuery库 : (二) 选择器

    作用 选择器同意您对元素组或单个元素进行操作. 在前面的章节中,我们介绍了一些有关怎样选取 HTML 元素的实例. 关键点是学习 jQuery 选择器是怎样准确地选取您希望应用效果的元素. jQuer ...

  3. 02_Jquery_01_id选择器

    首先建立建立一个JavaWeb项目工程,导入jquery-1.5.1.js. (一)选择器--打印文本内容 [index.jsp] <%@ page language="java&qu ...

  4. 第四章:JQuery选择器

    一.使用选择器的目的 从页面上的万万千千个元素中选择自己需要的. 二.选择器的分类 1.基本选择器 *:标签 *:类 *:ID 交集  AB   AB共同的部分    并集  A,B  AB使用相同的 ...

  5. Jquery_基础(一) 常用方法与选择器

    一.Jquery常用方法: $(function(){ //掌握$() 以及function(){} 结合 $("#a01").click(function(){ alert('h ...

  6. CSS 分类 选择器

      CSS:层叠样式表(英文全称:Cascading Style Sheets)         后缀名:css         标志  style         对网页中元素位置的排版进行像素级精 ...

  7. CSS选择器分类总结

    一.选择器语法及其意义(pattern and meaning) Pattern Meaning CSS level E an element of type E 标记选择器,匹配所有标签名为E的元素 ...

  8. CSS 引入方式 选择器

    ---恢复内容开始--- CSS是Cascading Style Sheets的简称,中文称为层叠样式表,用来控制网页数据的表现,可以使网页的表现与数据内容分离. 步骤: A.找到标签 B.操作标签 ...

  9. 第1章jquery选择器

    一.jquery等价于$ jquery选择器继承了css选择器的风格. $("#ID")代替了document.getElementById()函数,即通过id获取元素. $(&q ...

随机推荐

  1. 华硕N55SF 折腾记

    家里给老妈用的N55SL是2011年买的.这么多年了,最近一身毛病,最近来回折腾很多次.吐槽记录如下 1不定时花屏.闪屏,然后偶尔硬盘掉盘 (找不到硬盘,开机BIOS里).主要是使用一段时间之后发热, ...

  2. AtCoder Regular Contest 102 D - All Your Paths are Different Lengths

    D - All Your Paths are Different Lengths 思路: 二进制构造 首先找到最大的t,使得2^t <= l 然后我们就能构造一种方法使得正好存在 0 到 2^t ...

  3. Python + Selenium WebDriver Api 知识回顾

    一直再用 Selenium WebDriver 但是用的都比较零散,也没有做过总结,今天借此机会,整理一下,方便大家使用时查阅 webDriver  的属性 ['CONTEXT_CHROME', 'C ...

  4. php如何控制客户端生成缓存

    php如何控制客户端生成缓存 一.总结 一句话总结:用http消息响应头中的Cache-Control来控制客户端缓存,说的是页面本身被客户端缓存,而不是重新生成的其它的非页面缓存 响应头Cache- ...

  5. ThinkPHP的数据操作

    查询: 具体数据的操作方法使用: 1. where()条件     $model->where(条件值);  //条件值就是sql语句where后边的结果值 2. limit() 限制条数  $ ...

  6. caffe在win10下的安装与配置

    1.Windows环境caffe安装配置(无GPU) 参考:http://www.cnblogs.com/cxyxbk/p/5902034.html 解压caffe-windows文件,将./wind ...

  7. Android中SharedPerforences的简单使用示例 --Android基础

    SharedPreferences是Android平台上一个轻量级的存储类,用来保存应用的一些常用配置,比如Activity状态,Activity暂停时,将此activity的状态保存到SharedP ...

  8. C#中读取xml文件指定节点

    目录(?)[-] XmlDocumentSelectSingleNode方法的使用 XmlDocumentSelectNodes方法的使用 通过节点属性查找指定节点   参考:Select XML N ...

  9. LeetCode--349--两个数组的交集

    问题描述: 给定两个数组,编写一个函数来计算它们的交集. 示例 1: 输入: nums1 = [1,2,2,1], nums2 = [2,2] 输出: [2] 示例 2: 输入: nums1 = [4 ...

  10. python基础之面向对象的多继承以及MRO算法

    内容梗概: 1. python多继承 2. python经典类的MRO 3. python新式类的MRO C3算法 1.python多继承 class Shen: def fly(self): pri ...