ID选择符、类选择符和HTML标记选择符三者之间的优先级顺序是：ID选择符>类选择符>HTML标记选择符，但是可以用!important提升优先权。

　　如：       p{color:#f00 !important}       /*(注#f00是红色)*/

　　　　.blue{color:#00f}

　　　　#yellow{color:#ff0}

此时p标签的内容显红色（firefox中的显示效果，ie6important支持不好），优先级最高。

　

具体代码如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="gb2312">

<head>

<title>优先级</title>

<style href="text/css">

p{color:#f00 !important}       /*(注#f00是红色)*/

.blue{color:#00f}

#yellow{color:#ff0}

</style>

</head>

<body>

<p class="blue" id="yellow">jafkaj</p>

</body>

</html>

当去掉css中p标签的!important，同样的代码，字体显示黄色（firefox中的显示效果），此时ID选择符优先级最高。

当去掉css中p标签的!important，再把<p class="blue" id="yellow">jafkaj</p>改为<p class="blue">jafkaj</p>，其他代码不变，字体显示蓝色（firefox中的显示效果），说明类选择符的优先级比HTML标记选择符高。

以上实例很好的说明了ID选择符、类选择符和HTML标记选择符三者优先级的高低顺序，ID选择符优先级高于类选择符，类选择符的优先级高于HTML标记选择符。

转载收藏：http://www.cnblogs.com/longzhiyi/archive/2009/09/25/1573900.html

说说ID选择符、类选择符和HTML标记选择符的优先级顺序的更多相关文章

  1. Python属性、方法和类管理系列之----描述符类

    什么是描述符类? 根据鸭子模型理论,只要具有__get__方法的类就是描述符类. 如果一个类中具有__get__和__set__两个方法,那么就是数据描述符,. 如果一个类中只有__get__方法,那 ...

  2. 11.python描述符---类的装饰器---@property

    描述符1.描述符是什么:描述符本质就是一个新式类,在这个新式类中,至少实现了__get__(),__set__(),__delete__()这三个内置方法中的一个,描述符也被称为描述符协议(1):__ ...

  3. （转）类（class）和结构（struct）的区别是什么？它们对性能有影响吗？.NET BCL里有哪些是类（结构），为什么它们不是结构（类）？在自定义类型时，您如何选择是类还是结构？

    转自:http://blog.csdn.net/lingxyd_0/article/details/8695747 类(class)和结构(struct)的区别是什么?它们对性能有影响吗?.NET B ...

  4. 12-01 Java Scanner类，Scanner类中的nextLine()产生的换行符问题

    分析理解:Scanner sc = new Scanner(System.in); package cn.itcast_01; /* * Scanner:用于接收键盘录入数据. * * 前面的时候: ...

  5. 图像处理中创建CDib类时无法选择基类类型时怎么办

    图像处理中创建CDib类时无法选择基类类型时怎么办? 类的类型选择Generic Class 在下面的篮筐里输入CObject就行了

  6. CSS 简介、语法、派生选择器、id 选择器、类选择器、属性选择器

    CSS 概述 CSS 指层叠样式表 (Cascading Style Sheets) 样式定义如何显示 HTML 元素 样式通常存储在样式表中 把样式添加到 HTML 4.0 中,是为了解决内容与表现 ...

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

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

  8. 2017-5-14 湘潭市赛 Partial Sum 给n个数，每次操作选择一个L,一个R，表示区间左右端点，该操作产生的贡献为[L+1,R]的和的绝对值-C。 0<=L<R<=n; 如果选过L,R这两个位置，那么以后选择的L,R都不可以再选择这两个位置。最多操作m次，求可以获得的 最大贡献和。

    Partial Sum Accepted : Submit : Time Limit : MS Memory Limit : KB Partial Sum Bobo has a integer seq ...

  9. id选择器、类选择器、属性选择器

    在网页编辑时,通常要对样式进行各种设置.我们借助CSS样式设计中的选择器,就能很好很方便的对它们进行管理和设置了. 今天,跟大家分享一下几个常用的选择器:id选择器.类选择器.属性选择器. id选择器 ...

随机推荐

  1. springMVC使用与生成序列号

    springMVC使用与生成序列号 我是以springMVC的方式提供序列号 代码可以直接在项目中用 第一步:controller类 @Autowired private PkGenerator pk ...

  2. 向mysql数据库中插入大二进制文件和大文本

    @Test      public void run() throws ClassNotFoundException, SQLException,                 FileNotFou ...

  3. X32,X64,X86 代表什意义

    X32,X64,X86是什么意思 各代表什么:X86指32位,X64指64位,现在用户最多的是XP,但win7是趋势,发展很快,建议你装个win7 32位的系统,下载的话地方很多,官方安装原版和gho ...

  4. mybatis关联查询，一对一，一对多

    注:这篇文章的代码有部分删减,不能直接使用,不过关键代码都存在  应用场景: 想用mybatis做关联查询,并且把查询出的数据自动组装成对象可以使用关联查询. 1.一对一实现 例如:一部小说,属于一个 ...

  5. Angular $http解析通过接口获得的json数据

    刚接触angular不久,对很多东西都不了解,今天需要用angular通过接口得到json数据,折腾了好久,总算是能获取到数据了,下面是部分源码,仅供参考: HTML部分: <body ng-a ...

  6. c#基础-类型基础深入了解

    对象类型需要动态内存,基础类型需要静态内存 动态内存分配在堆上,静态内存分配在栈上. 静态内存保存着简单的变量,如 int a=0; 值类型:把一个值类型赋值给另外一个值类型,改变其中一个另外一个不会 ...

  7. java并发库_并发库知识点整理

    并发库(java.util.concurrent)中的工具数不胜数,那么我们梳理一下线程并发库中重要的一些常用工具: 1.

  8. 29、shiro框架入门

    1.建立测试shiro框架的项目,首先建立的项目结构如下图所示 ini文件 中的内容如下图所示 pom.xml文件中的内容如下所示 <project xmlns="http://mav ...

  9. wamp密码设置

    WAMP安装好后,mysql密码是为空的,那么要如何修改呢?其实很简单,通过几条指令就行了,下面我就一步步来操作. 首先,通过WAMP打开mysql控制台. 提示输入密码,因为现在是空,所以直接按回车 ...

  10. oracle SQL查询中间若干条记录

    方法一:利用rownum和差集函数minus select * from ( select * from emp order by sal) where rownum<13 minus sele ...