样式的优先级

多重样式(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

转载于:https://www.cnblogs.com/BearLee/p/7932404.html

【CSS】CSS 的优先级总结相关推荐

  1. 【CSS】选择器优先级

    CSS的选择器优先级的权重 在 Selectors Level 3 规范中,一个选择器的优先级(权重)由依次串联的a.b.c三个标记来计算 a: ID选择器 如#header b: class选择器如 ...

  2. Web开发(一)·期末不挂之第四章·CSS语法基础(CSS选择器选择器优先级各类样式表的使用方法)

    CSS语法基础 一.单纯html控制样式的缺点 二. CSS✪✪✪ CSS概述 CSS基础语法 组成 选择器 标签选择器 类选择器 id选择器 通配选择器 后代选择器 插入样式表的三种方式 行内样式 ...

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

    选择器种类 严格来讲,选择器的种类可以分为三种:标签名选择器.类选择器和ID选择器.而所谓的后代选择器和群组选择器只不过是对前三种选择器的扩展应用.而在标签内写入style=""的 ...

  4. html css控制优先级,css权重及优先级问题_html/css_WEB-ITnose

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

  5. CSS中选择器优先级顺序实战讲解

    原文:CSS中选择器优先级顺序实战讲解 我们有些程序猿在给一个元素(比如div)应用样式的时候,会有一些疑问,为什么我写在后面的样式不能覆盖前面的样式呢,不是说CSS是层叠样式表吗? 如果你在开发中也 ...

  6. CSS选择器的优先级的相关介绍

    css选择器的优先级 使用不同的选择器,选中同一个元素并且设样式的时候, 这样样式就会产生冲突,最终到底采用哪一个选择器定义的样式,由选择器的优先级(权重)决定,优先级高的优先显示 优先级规则(权重值 ...

  7. css !important用法以及CSS样式使用优先级判断

    之前一直看到很多css中都有!important这个样式,一直不知道有什么作用的,今天在网上详细了解了一下,看了别人的博客,顺便转载收藏一下 css !important用法CSS样式使用优先级判断 ...

  8. 【CSS笔记】CSS选择器的优先级(权重)

    目录 1.1.选择器的优先级 1.2.CSS选择器权重 1.1.选择器的优先级 CSS选择器的优先级顺序如下所示: 内联样式(style) > id选择器 > class选择器 > ...

  9. CSS选择器的优先级是怎样的?

    CSS选择器的优先级是:内联 > ID选择器 > 类选择器 > 标签选择器 到具体的计算层面,优先级是由 A .B.C.D 的值来决定的,其中它们的值计算规则如下: A 的值等于 1 ...

  10. CSS css选择器 jquery jQuery选择器的优先级 XXX XX X xxx xx x

    CSS css选择器 jquery jQuery选择器的优先级 XXX XX X xxx xx x 行间选择器 id选择器 类选择器 元素选择器 通配符选择器

最新文章

  1. 浅说国际根域名服务器与中国电信的镜像服务器
  2. 苹果推出开源医学研究框架ResearchKit
  3. 以太网帧,ARP报文
  4. android blockcanary 原理,blockCanary原理
  5. 大型企业网络配置系列课程详解(四) --HSRP和VRRP配置与相关概念的理解(一)...
  6. 1047 行 MySQL 详细学习笔记(值得学习与收藏)
  7. mysql事务日志备份_事务日志备份 (SQL Server)
  8. JS concat() 方法
  9. Lenovo E47A Ubuntu闪屏解决办法
  10. [Oracle]Oracle表权限小结
  11. BZOJ-2257 瓶子和燃料 分解因数+数论方面乱搞(裴蜀定理)
  12. java分页之页面分页—@易小川
  13. PKI体系(公钥基础设施)
  14. 计算机工作组如何添加打印机,局域网添加打印机,详细教您局域网打印机怎么添加...
  15. 【毕业设计】基于大数据的招聘职业爬取与分析可视化
  16. RAVDESS语音情感分类数据集的介绍
  17. 2020年编程语言排行榜!
  18. 揭秘软件开发中的达摩克利斯之剑
  19. windows7图形界面远程centos6.5
  20. 程序员在论坛里炫耀公司待遇,一线互联网公司员工直接晒出下午茶

热门文章

  1. java B2B2C源码电子商务平台 --zuul跨域访问问题
  2. WPF ListView展示层叠信息
  3. 浅淡 RxJS WebSocket
  4. angularJS之angular-datatable的方法
  5. 针对IE的CSS hack 全面 实用
  6. 怎么才能显示Eclipse中ConSole的全部输出内容
  7. java 二维数据结构_JAVA描述算法和数据结构(01):稀疏数组和二维数组转换
  8. 开放性实践活动微信客服_什么是开放组织中的实践社区?
  9. 如何在Windows上安装Python
  10. raspberry pi_如何为Raspberry Pi编写SD卡