样式的优先级

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

(内部样式就是css写在html页面的<style>标签中)
(内联样式就是css直接写在html标签的style属性中)

选择器的优先权

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

2. ID 选择器的权值为 100

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

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

CSS 优先级法则

A 选择器都有一个权值,权值越大越优先;

B 当权值相等时,后出现的样式表设置要优于先出现的样式表设置;

C 创作者的规则高于浏览者:即网页编写者设置的CSS 样式的优先权高于浏览器所设置的样式;

D 继承的CSS 样式不如后来指定的CSS 样式;

E 在同一组属性设置中标有“!important”规则的优先级最大

F 同一个css文件中,对同一个选择器同一个优先级的内容,写得排在后面的内容会覆盖前面的内容。比如:.abc{margin:10px;}.abc{margin:20px;},最终的到的class为abc的内容的margin值是20px。这个原因是css文件的运行方式,是从前往后开始解读运行的。

css优先机制的更多相关文章

  1. css考核点整理(二)-css层叠机制

    css层叠机制 外边距重叠就是margin-collapse. 在CSS当中,相邻的两个盒子(可能是兄弟关系也可能是祖先关系)的外边距可以结合成一个单独的外边距.这种合并外边距的方式被称为折叠,并且因 ...

  2. css优先级机制说明

    原文:css优先级机制说明 首先说明下样式的优先级,样式有三种: 1. 外部样式(External style sheet) 示例: <!-- 外部样式 bootstrap.min.css -- ...

  3. CSS样式的优先机制

    链接:http://www.cnblogs.com/xugang/archive/2010/09/24/1833760.html 又抓到虫子了:IE中奇怪的应用CSS的BUG:http://www.c ...

  4. css 优先级 机制

    多重样式(Multiple Styles):如果外部样式.内部样式和内联样式同时应用于同一个元素,就是使多重样式的情况. 一般情况下,优先级如下: (外部样式)External style sheet ...

  5. 三.CSS层叠机制

    概述 层叠就是对样式的层叠.是某种样式在样式表中逐层叠加的过程.让浏览器对某个标签特定属性值的多个来源,最终确定使用那个值.层叠是整个CSS的核心机制. HTML文档样式的来源 1.浏览器默认样式,每 ...

  6. CSS定位机制

    CSS中,存在3种定位机制:标准文档流(Normal flow) * 特点:从上到下,从左导游,输出文档内容 * 由块级元素和行级元素组成 浮动(Floats) * 能够实现横向多列布局 * 设置了浮 ...

  7. css层叠机制说明

    css通过建立与文档的关联而实施效果.文档结构重要性不言而喻,对于建立良好的内容索引.提高可维护性.较好的可访问性:另,利于css选择器选择.继承机制. 概要地讲,层叠机制是处理对文档上应用样式时解决 ...

  8. localStorage的黑科技-js和css缓存机制

    一.发现黑科技的起因  今天在微信公众号看到一篇技术博文,想用印象笔记收藏,所以发送了文章链接到pc上.然后习惯性地打开控制台,看看源码,想了解下最近微信用了什么新技术.  呵呵,以下勾起了我侦探的欲 ...

  9. 关于CSS层叠机制

    谈到层叠机制,首先我们要知道什么是声明冲突. 声明冲突有三个条件:①多个选择器选中同一个元素:②声明块里的属性相同:③属性的属性值不同.同时满足这三点时就会产生声明冲突.比如下图html代码: < ...

随机推荐

  1. 守护进程和inetd超级服务器

    守护进程: 1 系统启动时,由系统初始化脚本启动.一般在/etc目录下,或者以/etc/rc开头的目录 2 许多网络服务器由inetd超级服务器启动 3 cron守护进程按规则定期执行一些程序 4 用 ...

  2. jqGrid初次使用遇到的问题及解决方法

    问题一:初始化定义翻页用的导航栏时,表中出现"undefined"方框: 解决:需要导入grid.locale-cn.js文件. 问题二:页面只有一页,无法翻页: 解决:初始化设置 ...

  3. javaScript 获取主机地址,项目名等

    //获取当前网址  var curWwwPath=window.document.location.href; alert(curWwwPath);  //http://localhost:8080/ ...

  4. spring-flex

    mvn install:install-file -Dpackaging=jar -DgroupId=com.adobe.blazeds -Dversion=4.0.0.14931 -Dartifac ...

  5. VPW Communication Protocol

    http://www.fastfieros.com/tech/vpw_communication_protocol.htm Breakdown of the j1850 3 byte Header f ...

  6. Thinkphp的Volist标签

    Volist标签主要用于在模板中循环输出数据集或者多维数组. volist标签(循环输出数据) 闭合 非闭合标签 属性 name(必须):要输出的数据模板变量 id(必须):循环变量 offset(可 ...

  7. IPv6 相关的工作简介

    这里说明下,仅仅是IPv6在开发板上的相关的工作简介,没有很详细,都是自己一边积累,一边实践的.能帮助其他人最好,也算是给自己做个备忘录. 一.首先说下DHCPv6相关的.这里我使用的是DHCP6s. ...

  8. UVA 674 Coin Change (DP)

    Suppose there are 5 types of coins: 50-cent, 25-cent, 10-cent, 5-cent, and 1-cent. We want to make c ...

  9. C# RSA和Java RSA互通

    今天调查了C# RSA和Java RSA,网上很多人说,C#加密或者java加密 ,Java不能解密或者C#不能解密 但是我尝试了一下,发现是可以的,下面就是我尝试的代码,如果您有什么问题,我想看看, ...

  10. 如何理解js

    1.js/dom功能 2.performance 3.code organization 4.tools and flow 如何理解js代码,代码即业务. 如何快速理解代码业务.