样式的优先级

(外部样式)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. Windows性能计数器2

    判断瓶颈 Ø 判断应用程序的问题 如果系统由于应用程序代码效率低下或者系统结构设计有缺陷而导致大量的上下文切换(context switches/sec显示的上下文切换次数太高)那么就会占用大量的系统 ...

  2. vector和iterator及collection

    Collection是所有集合的最上层接口,它里面定义了所有集合对象都可以进行的操作:它有两个子接口,分别是List和Set.List会记录放在其中元素的放入顺序,形象地说,可以认为是一个传送带,它上 ...

  3. gzip压缩JavaScript

    为了提高客户端的体验效果,RIA开发逐渐兴起.这样会项目中会充斥的大量的JavaScript代码,与此同时会消耗客户端浏览器性能.对于 Ext 实现的 one page one application ...

  4. C#中正则表达式进行忽略大小写的字符串替换

    在C#里要进行忽略大小写的字符串替换,用string的Replace是很难做到的,即使花了天大的力气做到了,效率仍然是很低的,正确的方法应该是使用正则表达式. 要使用正则表达式,首先需要引用命名空间: ...

  5. linux C高手成长过程---书籍推荐

    建议学习路径: 首先先学学编辑器,vim, emacs什么的都行. 然后学make file文件,只要知道一点就行,这样就可以准备编程序了. 然后看看<C程序设计语言>K&R,这样 ...

  6. 【React Native 实战】微信登录

    1.前言 在今天无论是游戏开发还是app开发,微信作为第三方登录必不可少,今天我们就用react-native-wechat实现微信登录,分享和支付同样的道理就不过多的介绍了. 2.属性 1)regi ...

  7. iOS开发——UI篇Swift篇&UIWebView

    UIWebView //返回按钮事件 @IBAction func backButtonClick() { self.navigationController?.popViewControllerAn ...

  8. Xcode和IOS模拟器

    Xcode和IOS模拟器 目录 概述 Xcode常用操作 学会用Instrument IOS模拟器 概述 Xcode常用操作 整体缩进或者缩退 command+“[” .command+“]” 在同一 ...

  9. 关于egg的压缩测试报告

     167274doc  单字分词 全压缩 时间  real 15m58.464suser 13m52.157ssys 2m3.445s   空间 tmpfs 12G 1.5G 11G 13% /ape ...

  10. WPF 之 文本框及密码框添加水印效果

    1.文本框添加水印效果 文本框水印相对简单,不需要重写模板,仅仅需要一个 VisualBrush 和触发器验证一下Text是否为空即可. <TextBox Name="txtSerac ...