2

我正在构建一个 javascript 插件/CSS 表，它必须覆盖页面的原始样式（该插件使任何静态站点都具有响应性）。

目前，如果我有类似的东西：

<body id="home">
    <div style="width:900px; background:green; height:500px; margin:0 auto;">
        <div style="width:400px; background:blue; height:300px;"
            <p>Hello hello hello hello hello hello</p> 
        </div>
    </div>  
    <div style="width:800px; background:green; height:500px;">
        <div style="float:left; width:400px; background:blue; height:300px;"
            <p>blah blah blah blah blah</p> 
        </div>
    </div>
    <link rel="stylesheet" href="css/jq_responsive.css" >
    <script src="js/main.js"></script>
</body>

我的 jq_responsive.css 样式不优先于内联样式。如果我将内联样式放在文档的<style>标签中<head>，则应用指向 jq_responsive.css 文件应覆盖的所述样式的类。但是，这不是我的目的的选择。

是!important我可以在这里覆盖的唯一方法吗？如果可能的话，我想避免这种情况。

4

1 回答 1

5

特异性新月顺序

以下选择器列表是通过增加特异性：

  • 通用选择器
  • 类型选择器
  • 类选择器
  • 属性选择器
  • 伪类
  • ID 选择器
  • 内联样式

https://developer.mozilla.org/en-US/docs/CSS/Specificity

!important 可能是 CSS 中唯一的方法，或者您可以使用 JavaScript 删除内联 CSS

于 2013-02-18T08:17:07.493 回答