样式的优先级

多重样式(Multiple Styles):如果外部样式、内部样式和内联样式同时应用于同一个元素,就是使多重样式的情况。

一般情况下,优先级如下:

(外部样式)External style sheet <(内部样式)Internal style sheet <(内联样式)Inline style

有个例外的情况,就是如果外部样式放在内部样式后面,则外部样式将覆盖内部样式。

示例如下:

  

    <head>
<style type="text/css">
/* 内部样式 */
h3{color:green;}
</style> <!-- 外部样式 style.css -->
<link rel="stylesheet" type="text/css" href="style.css"/>
<!-- 设置:h3{color:blue;} -->
</head>
<body>
<h3>测试!</h3>
</body>

选择器的优先权

解释:

1.  内联样式表的权值最高 1000;

2.  ID 选择器的权值为 100

3.  Class 类选择器的权值为 10

4.  HTML 标签选择器的权值为 1

【CSS】CSS 的优先级总结的更多相关文章

  1. CSS样式之优先级

    说到到css的样式优先级,今天偶再来回顾下,从css的样式优先级可分为两个部分: 1.从CSS代码放置的位置看权重优先级:     内联样式 > 内部嵌入样式 >外联样式 2.从样式选择器 ...

  2. CSS样式选择器优先级

    CSS样式选择器分为4个等级,a.b.c.d,可以以这四种等级为依据确定CSS选择器的优先级. 1.如果样式是行内样式(通过Style=””定义),那么a=12.b为ID选择器的总数3.c为Class ...

  3. CSS选择器以及优先级与匹配原理

    最常用的五类CSS选择器 准确而简洁的运用CSS选择器会达到非常好的效果.我们不必通篇给每一个元素定义类(class)或ID,通过合适的组织,可以用最简单的方法实现同样的效果.在实际工作中,最常用的选 ...

  4. CSS选择器、优先级与匹配原理(转)

    CSS选择器.优先级与匹配原理 导航 为了分析Bootstrap源码,所以的先把CSS选择器相关的东东给巩固好 废话就不多说了 CSS 2.1 selectors, Part 1 计算指定选择器的优先 ...

  5. css权重及优先级问题

    css权重及优先级问题 几个值的对比 初始值 指定值 计算值 应用值 CSS属性的 指定值 (specified value)会通过下面3种途径取得: 在当前文档的样式表中给这个属性赋的值,会被优先使 ...

  6. [程序猿入行必备]CSS样式之优先级

    专业玩家请移步:http://www.w3.org/TR/CSS2/cascade.html 使用CSS控制页面样式时,常常出现设定的样式被"覆盖",不能生效的情况. 浏览器是根据 ...

  7. CSS 选择器及其优先级

    CSS 的选择器有很多类型,我们将常用的这些列表如下: 一.CSS 选择器的类别 1. 基本选择器 基本选择器 解释 备注 * 通用选择器,匹配所有元素 CSS2 E 元素选择器,匹配类型为 E 的所 ...

  8. CSS样式的优先级

    1.相同权值情况下,CSS样式的优先级总结来说,就是--就近原则(离被设置元素越近优先级别越高): 内联样式表(标签内部)> 嵌入样式表(当前文件中)> 外部样式表(外部文件中). 2.权 ...

  9. 详解CSS选择器、优先级与匹配原理

    原文链接:http://polaris1119.javaeye.com/blog/764428 作为一个Web开发者,掌握必要的前台技术也是很重要的,特别是在遇到一些实际问题的时候.这里给大家列举一个 ...

  10. 转载:详解CSS选择器、优先级与匹配原

    转载网址:http://polaris1119.javaeye.com/blog/764428 文章就CSS选择器的优先级问题做了一些总结,严格来讲,选择器的种类可以分为三种:标签名选择器.类选择器和 ...

随机推荐

  1. 如何在mssql中获取最新自增ID的值

    @@IDENTITY 返回最后一个插入 IDENTITY 的值,这些操作包括:INSERT, SELECT INTO,或者 bulk copy.如果在给没有 IDENTITY 列的其他表插入记录,系统 ...

  2. (转)yi_meng linux 下 ifcfg-eth0 配置 以及ifconfig、ifup、ifdown区别

    linux 下 ifcfg-eth0 配置 以及ifconfig.ifup.ifdown区别 原文:https://www.cnblogs.com/yi-meng/p/3214471.html这3个命 ...

  3. Storm概念学习系列之storm的特性

    不多说,直接上干货! storm的特性 Storm 是一个开源的分布式实时计算系统,可以简单.可靠地处理大量的数据流. Storm支持水平扩展,具有高容错性,保证每个消息都会得到处理,而且处理速度很快 ...

  4. 【PKI】PKI-中的几种证书的区别

    CA根证书:CA根证书是整个PKI系统的根证书. 管理根证书:根CA,二级CA,KMC都有管理根证书,用来在系统部署时签发本级的超级管理员和审计管理员. 站点证书:CA.RA要和用户走SSL通讯,需要 ...

  5. jquery.validate+jquery.form表单验证提交

    1.通过jquery.validate的submitHandler选项,即当表单通过验证时运行回调函数.在这个回调函数中通过jquery.form来提交表单: <script type=&quo ...

  6. 固定ip地址

    IP.  配置文件写数据库文件连接时,之前一直是就写个.  ; 毕竟之前就自己本地用.现在需要,写ip地址,但是公司点的ip的都是自动获得的.并且过一段时间还会改变. 所以,需要固定一下啊. 首先cm ...

  7. WPF自定义分页控件,样式自定义,简单易用

    WPF自定义分页控件 做了许久伸手党,终于有机会贡献一波,搜索一下WPF分页控件,还是多,但是不太通用,主要就是样式问题,这个WPF很好解决,还有一个就是分页控件嘛,只关心几个数字的变动就行了,把页码 ...

  8. Intellij IDEA 最头大的问题,如何自定义注释模板?

    想栈长我当初从 Eclipse 转用 IDEA 真是纠结,放弃然后尝试了N次,不过现在已经算是转型成功了,可以完全脱离 Eclipse 撸码了,虽然说我现在真的撸得非常少了.. 说到 IDEA 的痛点 ...

  9. <script>, <script async>, <script defer> 三种标签的区别

    <script>, <script async>, <script defer> 三种标签的区别 <script>标签 阻塞html parsing 脚 ...

  10. html便民查询各个工具类实例代码分享(支持pc和移动端)

    1.手机号码查询 <iframe id="api_iframe_51240" name="api_iframe_51240" src="&quo ...