如何绕过覆盖CSS声明

更新：请参见下面我的答案

我试图在

div

上使用第一个

.alert

CSS声明中的属性，即使第一个声明被后续声明覆盖

CSS

.alert{ margin:10px; } // one.css
.alert{ margin:0; } // two.css

HTML

<div class="alert">Hello!</div>

你好！

您知道有没有什么方法可以处理这种情况，而不必创建另一个声明来覆盖two.css中的声明

我搜索了谷歌，但我找不到解决这个问题的方法

---

编辑：如果我第一次声明

！重要信息

或增加其特殊性，然后我将停止使用第二个.alert声明。不幸的是，这不是一个选项。

使用

！重要信息

.alert{ margin:10px !important; } // one.css
.alert{ margin:0; } // two.css

---

或者使声明比

two.css中的声明更具体。或者在
two.css
之后加载
one.css
引用类名之前的父id选择器，以使该类属性具有主导值。如果没有父Id，请创建一个。你不必依赖于使用！重要的是，这并不是在所有情况下都能正常工作

像这样的

#parent .alert { margin:10px;}

根据普遍的共识，绕过CSS继承是不可能的。我需要做两件事中的一件来获得第一个声明最初应用的样式：

使第一个声明更具体或更有趣！重要的
用第三个声明覆盖第二个声明
这似乎是CSS中的一个很差的例子，所以如果你遇到类似的问题，那么请花点时间考虑一下你的样式表的设置方式。
我将尝试以另一种方式解决我自己的情况，如果我有任何有价值的东西要分享，也许我会回来提供更多信息。
您将应用于元素的第一个CSS规则存储起来，然后获取计算值并进行比较。如果值不相同，可以将元素设置为原始值

下面是一个函数，它循环遍历css规则并获取指定样式的值。您必须修改它以包含类（它当前按ID检查）并保存原始声明

您还可以创建一个新规则，其中只包含要包含的值，并将其应用于特定元素

function getCSSPropertyValueForElement(id, property) {
    var styleSheets = document.styleSheets;
    var numOfStylesheets = styleSheets.length;
    var values = [];
    var selectorText = "#" + id;
    var value;

    for(var i=0;i<numOfStylesheets;i++) {
        var styleSheet = styleSheets[i];
        var cssRules = styleSheet.cssRules;
        var numOfCSSRules = cssRules.length;
        var cssRule;

        for (var j=0;j<numOfCSSRules;j++) {
            cssRule = cssRules[j];

            if (cssRule.media) {
                var mediaRules = cssRule.cssRules;
                var numOfMediaRules = mediaRules ? mediaRules.length : 0;

                for(var k=0;k<numOfMediaRules;k++) {
                    var mediaRule = mediaRules[k];

                    if (mediaRule.selectorText==selectorText) {

                        if (mediaRule.style && property in mediaRule.style) {
                            value = mediaRule.style.getPropertyValue(property);
                            console.log(property+":" + value);
                            values.push(value);
                        }
                    }
                }
            }
            else {

                if (cssRule.selectorText==selectorText) {
                    if (cssRule.style && property in cssRule.style) {
                        value = cssRule.style.getPropertyValue(property);
                        console.log(property+":" + value);
                        values.push(value);
                    }
                }
            }
        }
    }

    return values.pop();
}

var property = "outline";
// getting the computed value / current value
var value = window.getComputedValue(element, "stylenamedoesntwork").style[property];

函数getCSSPropertyValueForElement（id，属性）{
var styleSheets=document.styleSheets；
var numostylesheets=styleSheets.length；
var值=[]；
var selectorText=“#”+id；
var值；
对于（var i=0；我认为如果不想创建第一个CSS规则
！important
如何
！important
？是否只在一页/几页上执行，其余页保持原样？如果不给元素一个不同的类或ID，就无法执行所需的操作。在任何特定页面上，某些
divs
 需要将边距设置为零，因此将第一个边距设为
！important
将打破这一限制。