按一般论:
ID > Class > 标签

1.如以下样式:

 <div id="id" class="class">选择器优先权</div>
#id{color:#aaa;}
.class{color:#bbb;}
div{color:#ccc;}

这里,最后输出 的结果为 #aaa;

2.如果把选择器改为:

 #id{color:#aaa;}
#id .class{color:#bbb;}
div{color:#ccc;}

最后,这里输出的颜色为:#bbb;

3.但如果HTML改为:

 <div id="id" class="class"><b>选择器优先权</b></div>
#id{color:#aaa;}
.class{color:#bbb;}
b{color:#ccc;}

这里最后输出结果即为:#ccc;

因为 #id与 .class 并没有直接作用于对象上,故最后的结果为 b 的 #ccc;

ID、Class和标签选择器优先级的更多相关文章

  1. css基础 引用方式 标签选择器 优先级 各式布局

    今天讲的css基础,了解了css即层叠式表,是美化网页,控制页面的样式. 样式表引进网页的3种方式1内联式,语法例子:<div style="width: 100px;height: ...

  2. CSS选择器优先级

    1.类的覆盖顺序和应用的时候引用的顺序没关系,覆盖顺序取决于类定义的顺序     例如: .a{ color:red } .b{ color:green }     由于b晚于a定义,所以b覆盖a,反 ...

  3. day48 前端高级选择器优先级

    复习 1. 基础选择器 标签选择器(div) | 类选择器(.div1) | id选择器(#div2) <div class="div1" id="div2&quo ...

  4. 我给女朋友讲编程CSS系列(2)- CSS语法、3大选择器、选择器优先级

    首先看一下使用Css设置h1标签字体颜色和大小的例子,效果图如下: 新建一个网页test.html,然后复制粘贴下面的内容: <html> <head> <style t ...

  5. CSS中选择器优先级与!important权重使用

    CSS中的选择器优先级与!important权重使用 .class选择器要高于标签选择器. #id选择器要高于.class选择器. 标签选择器是优先级最低的选择器. !important的属性它的权重 ...

  6. 盒子总结,文本属性操作,reset操作,高级选择器,高级选择器优先级,边界圆角(了解),a标签的四大伪类,背景图片操作,背景图片之精灵图

    盒子总结 ''' block: 设置宽高 1.没有设置宽,宽自适应父级的宽(子级的border+padding+width=父级的width) 2.没有设置高,高由内容撑开 设置了宽高 一定采用设置的 ...

  7. jquery基本选择器:id选择器、class选择器、标签选择器、通配符选择器

    全栈工程师开发手册 (作者:栾鹏) jquery系列教程1-选择器全解 jquery基本选择器 jquery基本选择器,包括id选择器.class选择器.标签选择器.通配符选择器,同时配合选择器的空格 ...

  8. jQuery easyUI id选择器 类选择器 标签选择器 属性选择器 及DOM对象和jQuery相互之间的转换

    首先导入js文件 <%@ page language="java" contentType="text/html; charset=UTF-8" page ...

  9. HTML+CSS教程(四)选择器(id选择器,类选择器,标签选择器,子代选择器,后代选择器,组选择器,伪类选择器)/css引入页面的形式(行内样式、内嵌样式、外联样式)

    一.回顾内容 前端的三大组成(三大模块)    HTMl(超文本标记语言) 结构层    css(层叠样式表) 表现层:用来美化HTML结构    JS(Java script)(脚本语言) 行为层: ...

随机推荐

  1. 类的专有方法(__repr__)

    # -*- coding: utf-8 -*- #python 27 #xiaodeng #http://blog.csdn.net/yyt8yyt8/article/details/7030416 ...

  2. 配置的好的Apache和PHP语言的环境下,如何在Apache目录下htdocs/html目录下 同时部署两个项目呢

    建虚拟目录打开Apache->conf->httpd.conf在最下面粘贴NameVirtualHost 127.0.0.1 <VirtualHost 127.0.0.1> S ...

  3. Loadrunner脚本编程(1)-大体思路

    http://www.360doc.com/content/10/0806/13/1698198_44076570.shtml 就目前的了解.Loadrunner的脚本语言其实和C没什么区别.他内部的 ...

  4. 用setitimer实现多个定时器

    从这篇文章中可以看出,setitimer只能实现一个定时器,如果多次调用setitimer,旧值都会被覆盖掉. 如何用setitimer实现多个定时器呢?下面是我的一个实现,具体的方法是: 用链表从小 ...

  5. [CXF REST标准实战系列] 一、JAXB xml与javaBean的转换(转)

    转自:[CXF REST标准实战系列] 一.JAXB xml与javaBean的转换 文章Points: 1.不认识到犯错,然后得到永久的教训. 2.认识JAXB 3.代码实战 1.不认识到犯错,然后 ...

  6. Python的 numpy中 meshgrid 和 mgrid 的区别和使用

    一.meshgrid函数 meshgrid函数通常使用在数据的矢量化上. 它适用于生成网格型数据,可以接受两个一维数组生成两个二维矩阵,对应两个数组中所有的(x,y)对. 示例展示: 由上面的示例展示 ...

  7. yaml语法三大规则

    规则一:缩进 yaml使用一个固定的缩进风格表示数据层结构关系,Saltstack需要每个缩进级别由两个空格组成.一定不能使用tab键 规则二:冒号 yaml:  mykey: my_value  每 ...

  8. mvc中Action前HttpPost的作用

    本文导读:在ASP.NET MVC框架中,为了限制某个action只接受HttpPost的请求,对于HttpGet的请求则提示404找不到页面,可以在action的方法前面加上[HttpPost]属性 ...

  9. python学习笔记011——闭包

    1 定义 定义:在计算机科学中,闭包是词法闭包的简称,是引用了自由变量的函数 简单地说:闭包就是能够读取其他函数内部变量的函数,闭包是将函数内部和函数外部连接起来的桥梁.——来源百度百科 2 描述 形 ...

  10. hdu 1213 How Many Tables(并查集求无向图有几个连通分量)

    代码: #include<cstdio> #include<cstring> using namespace std; int n,m; int father[1005]; i ...