当前位置: 首页 > 面试题库 >

CSS样式表按什么顺序覆盖?

尹弘壮
2023-03-14
问题内容

在HTML标头中,我得到了以下内容:

<head>
<title>Title</title>
<link href="styles.css" rel="stylesheet" type="text/css"/>
<link href="master.css" rel="stylesheet" type="text/css"/>

styles.css是我的页面专用表。master.css是我在每个项目上使用的工作表,用于覆盖浏览器的默认设置。这些样式表中哪个优先?示例:第一张纸包含特定内容

body { margin:10px; }

和相关的边界,但是第二个包含我的重置

html, body:not(input="button") {
    margin: 0px;
    padding: 0px;
    border: 0px;
}

本质上,CSS的级联元素在样式表引用方面是否与典型CSS函数中的相同?意思是显示的最后一行是?


问题答案:

CSS规则级联的规则很复杂-与其尝试严重地解释它们,不如简单地向您介绍该规范:

http://www.w3.org/TR/2011/REC-
CSS2-20110607/cascade.html#cascade

简而言之:更具体的规则会覆盖更一般的规则。根据涉及的ID,类和元素名称的数量以及是否使用!important声明来定义特异性。当存在多个具有相同“特定性级别”的规则时,以最后出现的那个为准。



 类似资料:
  • 问题内容: 我查看了Stack Overflow,但没有找到解决方案,我知道如何在样式存在的情况下覆盖样式,只需更改其属性即可。但是现在我有一种奇怪的样式可以覆盖 这是我所拥有的一个例子 首先我有一个: 现在,我需要使用以下一种样式来覆盖该样式: 问题是第一种样式会追加第二种,但是我不希望那样,在第二种样式中我只需要一行,而不是从第一种样式追加? 问题答案: 您可以将另一个类添加到元素中,而不是重

  • 在我的网站上,我使用reset.css。它为列表样式添加了以下内容:

  • 问题内容: 我正在开发页面,现在以我的CSS样式我有以下代码行 为我的页面。现在,我的某些页面不需要此行 我可能会在页面的内部CSS中覆盖它,这将导致原始行为被忽略? 问题答案: 使用不推荐,但在这种情况下,我想你应该- 在您的内部CSS中编写此代码-

  • 问题内容: 我有一些带有自己的CSS的HTML文件。我想在gwt应用程序中使用它们,所以我在应用程序中复制了html和css文件。 问题是当我打开HTML时,它使用了gwt主题样式。例如,在我的CSS中,html“主体”的背景色是黑色,但是除非我停用主题,否则它看起来是白色的。 如何覆盖gwt主题样式并使用CSS样式? 问题答案: 就像萨尔法兹(Sarfaz)所说- 应该是您的不得已的选择,因为它

  • 问题内容: 我试图弄清楚为什么我的一个css类似乎覆盖了另一个(而不是相反) 这里我有两个CSS类 在我看来,我打电话给 字体(重叠元素)显示为10px而不是20px-有人可以解释为什么会这样吗? 问题答案: 有几条规则(按此顺序应用): 内联css(html样式属性)覆盖样式标签和css文件中的css规则 较具体的选择器优先于较不具体的选择器 如果两个规则具有相同的特异性,则稍后出现在代码中的规

  • 我写了个最简单的ul,li。默认的样式应该是li的前面有个实心圆的,但是浏览器打开并没有出现,然后我用开发者工具检查了下它,发现有个注入样式表和用户代理样式表覆盖了我的样式。于是我上网查了下,这是我自己的迷糊理解:用户代理样式表是浏览器自带的,doctype也写了,目前我也找不到它在哪里就代入了,注入样式表可能是我的某个浏览器插件影响了页面,但是我关掉了所有的插件,还是没有解决。 于是,我尝试给u