问题标签 [css-cascade]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
15 回答
96837 浏览

css - CSS中的“级联”是什么意思?

CSS中“级联”一词的确切含义是什么?我得到了不同的看法,所以我在这里问。一个例子会有所帮助。

0 投票
1 回答
1207 浏览

javascript - 注入的链接样式表优先于 IE7+ 中的现有样式

级联动态样式表时,IE 中似乎存在错误。有谁知道是否有解决方法?考虑一下:

注入的“test.css”包含#test{background:green}.

即使我们将标签放在标签<link>之前<style>,IE7+ 也会用注入的样式表覆盖样式并应用绿色作为背景。

FF/Chrome 以正确的方式执行此操作,并让样式标记优先于注入的链接标记,因此背景保持红色。

0 投票
2 回答
2609 浏览

css - 隐藏 TD 的所有 div.class 孩子,然后显示第一个 div.class 孩子

据我所知,以下内容在理论上应该有效,但不是:

结果是,只要 small.attachments 元素没有 small.attachment 兄弟,它就会很好地显示,应用第一个子规则并覆盖 display:none 规则。

但是,当 TD 中有两个small.attachments元素时,一个接一个(在上面的示例中),两者都被隐藏,并且第一个子规则无效。

这是怎么回事?

PS:我在 Safari 和 Firefox 中测试过。

0 投票
1 回答
13550 浏览

css - 不同级别的 CSS 以及彼此的优先级

我在这里阅读了一篇关于这个主题的不错的文章:http ://www.plus2net.com/html_tutorial/css-types.php 它在谷歌搜索词 css 样式表优先级中排名最高。但是我认为该网站误导您并且不完整!有人可以证实我的怀疑吗?

1) 用户定义样式是次低优先级。为了用它覆盖其他样式,您需要使用 !important 将其移至最高。2) 它没有提到 <link> 与 <link> 中的 @import 和 @import 的相对优先级

更精确的排序是(1 胜 2 等):

  1. 用户定义(浏览器首选项!重要 - [不是谷歌浏览器!])
  2. 内联样式表(HTML 节点上的样式属性)
  3. 内部样式表(<head> 中的<style>)
  4. 外部样式表 (@import)
  5. 外部样式表 (<link>)
  6. 外部样式表(@import inside <link>)
  7. 用户定义 - (浏览器首选项 - [不是 Google Chrome!])
  8. 浏览器默认值 - (随浏览器提供)

Michael Bowers Pro CSS & HTML Design Patterns也是一个很好的来源。但它没有提到内联。

还有什么遗漏吗?

PS:我在推断 !important 从 2-8 丢失。所以用户定义出现两次。一次重要,第二次不重要。所以用户定义本质上是第二低的。!important 自然可以应用于任何级别。

0 投票
1 回答
508 浏览

css - 基于样式表中的顺序的CSS特异性/优先级?

我简要查看了CSS3 选择器规范,但找不到任何解决此问题的方法。此外,当您移动 CSS 声明时,我没想到结果会发生变化,但确实如此。任何帮助都会很棒。

0 投票
1 回答
800 浏览

css - 如何禁用级联选项?

我有所有 div 的 css 选项

如何使用 id 制作myDiv不会继承任何 CSS 选项的 div,除了#myDiv.

0 投票
2 回答
1270 浏览

css - 覆盖页脚小部件样式表中使用的 !important 属性

我有一个 twitter 小部件,它被加载到我页面的页脚中。问题是它在所有地方都使用 !important 属性。而且因为我的样式表都加载到了头部,小部件的样式表会自动覆盖我的任何样式表。

我真的必须在小部件下方的文档页脚中放置几个​​单独的样式来强制执行此操作。还是有更语义化的方法?

0 投票
4 回答
13706 浏览

css - 我是否正确地继承了我的 CSS?

我正在为我的网站制作一组按钮,我需要一些专业的见解。

为了减少 CSS 膨胀,我想将我的按钮子类化为不同的颜色,例如.button.blue 。

以后会不会出现以下问题?(假设我不只创建一个 .blue 类)我是否必须改用 .button.button-blue 之类的东西?

0 投票
1 回答
63 浏览

css - 对奇怪的级联问题感到困惑

我的 CSS 有一些奇怪的问题。我使用 SMACSS 方法重构了来自 @chriscoyier 的一些代码以对其进行模块化。

如果我将 .ribbon.green 移动到 CSS 的底部,它不会被应用。这与功能区:之后和功能区:之前有关吗?

将其移至底部似乎在 jsFiddle 中可以正常工作,但在 Firefox 或 Chrome 中则不行。 http://jsfiddle.net/SkinnyGeek1010/cDWKe/1/

关于它为什么这样做的任何想法?有没有办法将 .ribbon.green 移到底部?这将使使用 mixin 更改“皮肤”变得更容易。

** 添加了 dropbox html **
http://dl.dropbox.com/u/1407764/www/stackoverflow/corner-ribbon/green_ribbon_example.html

0 投票
2 回答
6792 浏览

css - 覆盖没有默认值的 CSS 属性

如果该属性没有默认值,是否可以在 CSS 中覆盖该属性?

例如,假设您的主样式表为特定元素定义了边框:

如果你想禁用辅助样式表的边框,你可以这样做:

假设第二个样式表是在第一个样式表之后加载的,则该border: none规则将优先并删除边框。

但是如果你试图覆盖一个没有默认值或空值的属性呢?

现在说,在您的辅助样式表中,您想这样做:

而且您不希望left. 没有这样的东西left: none;,所以......你如何“取消声明”left主样式表中分配的属性?