ASP.NET 错误正在添加内联 CSS 和覆盖样式

Question

我有一个单页 MVC Web 应用程序。当发生服务器错误时，我们会在同一页面的对话框中显示异常。 ASP.NET YSOD 添加了内联 CSS。由于添加到 BODY 元素的样式，这会更改整个应用的字体。

有没有办法将添加的 CSS 划分到该对话框中？还是在对话框关闭时删除了添加的 CSS 样式？或者编辑样式和错误页面，使样式不是全局的？

这是添加的内联 CSS：

<style>
    body {font-family:"Verdana";font-weight:normal;font-size: .7em;color:black;} 
    p {font-family:"Verdana";font-weight:normal;color:black;margin-top: -5px}
    b {font-family:"Verdana";font-weight:bold;color:black;margin-top: -5px}
    H1 { font-family:"Verdana";font-weight:normal;font-size:18pt;color:red }
    H2 { font-family:"Verdana";font-weight:normal;font-size:14pt;color:maroon }
    pre {font-family:"Lucida Console";font-size: .9em}
    .marker {font-weight: bold; color: black;text-decoration: none;}
    .version {color: gray;}
    .error {margin-bottom: 10px;}
    .expandable { text-decoration:underline; font-weight:bold; color:navy; cursor:hand; }
</style>

Answer 1

有几种方法可以克服这个问题。首先，您始终可以在样式标签的末尾设置 !important。

<style type="text/css">
  body {font-family:"Verdana" !important;font-weight:normal !important;font-size: .7em !important;color:black !important;} 
</style>

虽然我觉得这很麻烦而且很烦人。在我看来，更好的方法是，除非将 css 添加到实际元素（即<div style="font-size:15px;">Testing</div>），否则将弹出窗口元素包装在一个带有 ID 的包装器中，然后根据包装器设置所有 css，它是孩子们。当您在代码上设置更高的特异性时，它将覆盖较低的级别。

---

考虑三个代码片段：

A: h1
B: #content h1
C: <div id="content">
<h1 style="color: #fff">Headline</h1>
</div>

A的特异性是0,0,0,1（一个元素），B的特异性是0,1,0,1（一个ID参考点和一个元素），C的特异性值是 1,0,0,0，因为它是内联样式。 自从 0001 = 1

---

参考http://www.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know/

总的来说，这取决于你如何处理它，但如果你能掌握具体情况，使用它实际上要好得多。