原文地址：https://developer.mozilla.org/zh-CN/docs/Web/CSS/Specificity
css的MDN中文版，这一页是讲css的优先级的。
读到文章的最后，末尾部分，翻译貌似是罢工了，而且显示结果也出错了。

英文原版是这样的：

所以，我就来冒昧的翻译一下吧。
——————————–start—————————————————

选择器直接定位到元素的样式与元素继承的css样式进行优先级对比

如果通过css选择器直接定位到元素，那么在这个选择器中声明的样式就比元素继承（自祖先元素）的样式具有更高的优先级。而不管这个继承的样式本身是通过什么方式或者什么优先级的规则定义的。

#parent {

  color: green;

}

h1 {

  color: purple;

}

当它应用在以下html上的时候

<html>

<body id="parent">

  <h1>Here is a title!</h1>

</body>

</html>

浏览器会将它渲染成：

———————————-end———————————————————-

css优先级 中文版MDN补充翻译的更多相关文章

  1. css优先级机制说明

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

  2. 前端总结·基础篇·CSS（三）补充

    前端总结系列 前端总结·基础篇·CSS(一)布局 前端总结·基础篇·CSS(二)视觉 前端总结·基础篇·CSS(三)补充 目录 一.移动端 1.1 视口(viewport) 1.2 媒体查询(medi ...

  3. CSS优先级的两种理解方式

    方式一:值相加 我们先去MDN看看官方的解释: 优先级是如何计算的? 优先级就是分配给指定的 CSS 声明的一个权重,它由 匹配的选择器中的 每一种选择器类型的 数值 决定. 而当优先级与多个 CSS ...

  4. css选择器及css优先级

    三个css选择器:id选择器#test1{ }.class选择器.test2{ }.标签选择器div{ }对三个div:<div>我是普通div</div>.<div i ...

  5. 关于CSS的优先级,CSS优先级计算

    原则一: 继承不如指定原则二: #id > .class > 标签选择符原则三:越具体越强大原则四:标签#id >#id ; 标签.class > .class CSS优先级权 ...

  6. css 优先级 机制

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

  7. z-index、display、selector选择器优先级css优先级面试用到

    z-index:控制元素叠放顺序,哪个z-index数值越大,那个优先被叠放在上面. relative.absolute.fixed这三种情况可以使用z-index. static不可以使用. dis ...

  8. css优先级和层叠

    css优先级和层叠 1.优先级    计算方法:        a.行内样式        b.id选择器的数量        c.类,伪类和属性选择器的数量        d.标签选择器和伪元素选择 ...

  9. 使用background和background-image对CSS优先级造成影响

    在写一个关于背景图的CSS时候发现一个奇怪的现象, 原图: 如下代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitiona ...

随机推荐

  1. .NET进阶篇06-async异步、thread多线程1

    知识需要不断积累.总结和沉淀,思考和写作是成长的催化剂 异步多线程挺大一块内容,既想拆开慢慢学,又想一股脑全倒出.纠结再三,还是拆开吃透,也不至于篇幅过长,劝退许多人 本篇先做一个概述,列明一些基本概 ...

  2. 星空：差分，状压dp

    总算不再是能用暴力卡常/随机化水过的好T3了. 说是打了两个标签,实际上最关键的是题意转化. 如果你丝毫不转化的话也可以: #include<bits/stdc++.h> using na ...

  3. 「2019.8.11 考试」一套把OI写的很诗意的题

    这次写的更惨了,T2暴力再次挂掉了. 先写了T1的75暴力,然后写了T2的70分暴力(挂成了25),T3啥也不会骗了12分.T3看完题一点思路没有,心态爆炸了,一直在观察数据,忽略的思考的重要性,以至 ...

  4. 【WPF on .NET Core 3.0】 Stylet演示项目 - 简易图书管理系统(3) - 使用Conductor切换页面

    前两章中, 我们已经实现了这个图书管理系统的登录窗口, 并实施了完善的单元测试. 该是时候回过头来关注我们的主窗口了. 一个功能丰富的系统一般会有多个页面, 我们图书管理系统虽然是"简易&q ...

  5. 『图论』LCA最近公共祖先

    概述篇 LCA(Least Common Ancestors),即最近公共祖先,是指这样的一个问题:在一棵有根树中,找出某两个节点 u 和 v 最近的公共祖先. LCA可分为在线算法与离线算法 在线算 ...

  6. [深度学习][图像处理][毕设][笔记][安装环境][下载地址]安装VS2013、matconvnet、cuda、cudnn过程中产生的一些记录，2018.5.6号

    最近半个多月,被cuda等软件折磨的死去活来,昨天下午,终于安装好了环境,趁着matlab正在,在线下载VOT2016数据集,3点睡眼惺忪被闹醒后,睡不着,爬上来写这份记录. 先记录一下自己电脑的基本 ...

  7. python：模块1——标准库简介

    一.文档 windows系统:IDLE中打开帮助文档 Tutorial:简单入门 Library Reference:python内置函数和标准库(看不完的,当做字典来查)(此外还有pypi(拍派社区 ...

  8. oracle实现"limit"功能

    转载于http://blog.sina.com.cn/s/blog_67e2758d0100s3oc.html oracle数据库不支持mysql中limit功能,但可以通过rownum来限制返回的结 ...

  9. 关于IP网段划分

    IP地址分类(A类 B类 C类 D类 E类)     IP地址由四段组成,每个字段是一个字节,8位,最大值是255,, IP地址由两部分组成,即网络地址和主机地址.网络地址表示其属于互联网的哪一个网络 ...

  10. 用 GitBook 创建一本书

    用 GitBook 创建一本书 Gitbook 首先是一个软件,它使用 Git 和 Markdown 来编排书本,如果你没有听过 Git 和 Markdown,那么 gitbook 可能不适合你直接入 ...