Question

我正在构建一个必须覆盖页面原始样式的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是我在这里覆盖的唯一方法吗？如果可能的话，我想避免这种情况。

Answer 1

新月特异性顺序

以下选择者列表是通过提高特异性来实现的：

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

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

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

内联CSS是否覆盖页面底部的样式表？

1 个答案: