我在页面上有一个div。问题是它从样式表（样式表A）继承全局样式，例如全局ul和表样式，但是，我希望这个单独的div不这样做。我要求有问题的div 仅从另一个样式表（样式表B）中获取其样式。目前他们正在发生冲突。
有没有办法做到这一点而不必以任何方式触摸样式表A ？这是因为样式表A控制着我网站的所有主要样式，并且网站足够大，以至于更改可能会破坏某些内容。有问题的div保存与网站无关的数据，因此不需要样式表A.
我正在使用javascript Prototype如果有帮助吗？没有Jquery请：）
使用iframe怎么样？这是一个有效的解决方案，它将如何运作？
非常感谢所有帮助。
答案 0 :(得分：1)
最简单的方法可能是简单地找出div从样式表A继承的每个样式属性，然后用样式表B手动覆盖这些样式。
如果你想把div放到iframe中，那也应该有效。您需要该div拥有自己的HTML文件，托管在与主页面相同的域中（否则您将遇到安全问题）。链接到div页面中的stylesheetB，它会工作。但是，在设计iframe样式时，您会遇到一些问题。由于您无法从父文档中读取子文档中的CSS属性，因此您必须使iframe具有固定的宽度和高度，这在许多情况下都是有限的。我想你可以让iframe滚动，但这可能不是你想要的。
我认为最好的方法是在Firefox中使用Chrome Inspect Element或Firebug来查看div接收的CSS继承，然后
答案 1 :(得分：1)
任何重复的样式将始终应用最后一次阅读。
假设您在样式表A中使用此样式：.class { background-color: red; }，并在B中使用此.class { background-color: blue; }。
因此，如果您在B：
之前调用样式表A.<link href="sheet_a.css" rel="stylesheet" type="text/css" />
<link href="sheet_b.css" rel="stylesheet" type="text/css" />
然后应用的样式将是.class { background-color: blue; }，因为它是浏览器读取的最后一个样式。
现在，如果这不起作用（如果您的样式表以不同的顺序调用，或者A中的样式比B中的样式更具体，那么A仍在应用中），您可以使用{{ 3}}。
.class { background-color: blue !important; }将覆盖A中的样式，只要它在原始样式中没有！重要。
如果您只想更改一个元素，则不一定需要新的样式表。您可以在html头中的<style></style>标记之间添加新样式，或者在元素（<div style="background-color: blue;"></div>）中内联。内联元素比外部元素更具相关性。
答案 2 :(得分：0)
您可以在html结构上使用inline styles，也可以在样式表b 上添加!important以覆盖样式表a <上的样式/强>
例如，在样式表b 上，您可以执行以下操作：
.element {background:red !important}