样式的优先级

(外部样式)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. JavaScript 各种遍历方式详解,有你不知道的黑科技

    http://segmentfault.com/a/1190000003968126 为了方便例子讲解,现有数组和json对象如下 var demoArr = ['Javascript', 'Gulp ...

  2. eclipse添加第三方源码

  3. python中使用list作为默认参数且调用时不给其赋值的问题

    最近在写代码时发现一个有趣的地方,当python中的函数使用list作为默认参数且调用时不给其赋值时,无法通过在函数中将其赋值为[]来达到清空此默认参数的目的.按照道理来说,函数f1中的list为局部 ...

  4. OC基础之方法和参数的命名规范

    以前学过C/C++/Java/C#语言的童鞋可能刚开始对于OC的方法和参数的命名规范大为不爽 举例来说,如下一个OC方法: - (void)tableView:(UITableView *)table ...

  5. C#的WinForm中制作饼状图和柱状图

    using System; using System.IO;//用于文件存取 using System.Data;//用于数据访问 using System.Drawing;//提供画GDI+图形的基 ...

  6. Codeforces #250 (Div. 2) C.The Child and Toy

    之前一直想着建图...遍历 可是推例子都不正确 后来看数据好像看出了点规律 就抱着试一试的心态水了一下 就....过了..... 后来想想我的思路还是对的 先抽象当前仅仅有两个点相连 想要拆分耗费最小 ...

  7. 发现js端日期跟php端日期格式不一致

    当程序没有问题,而php显示的日期和js显示的日期不一致,相差一天的时候或者其它,一定要看看php.ini中时区的配置是否合理.

  8. C++ SFINAE

    1. 什么是SFINAE 在C++中有很多的编程技巧(Trick), SFINAE就是其中一种, 他的全义可以翻译为”匹配失败并不是一个错误(Substitution failure is not a ...

  9. mfc extention dll 與 normal dll 的區別

    extention dll 1.指從MFC中繼承過來的DLL,一般要求使用共享MFC DLL進行連接,也要求調用者也使用MFC且使用共享MFC,如此可保證DLL與調用者有相同的MFC庫. 2.在使用資 ...

  10. Anatomy of the Linux kernel--转

    ref:http://www.ibm.com/developerworks/linux/library/l-linux-kernel/?S_TACT=105AGX52&S_CMP=cn-a-l ...