DIV 在同一个文档中具有单独的 CSS 文件？答案

【问题标题】：DIV with seperate CSS file in same document?DIV 在同一个文档中具有单独的 CSS 文件？
【发布时间】：2013-09-13 05:09:07
【问题描述】：

是否可以为文档中的 div 设置单独的 CSS 文件。此DIV 不应继承页面中包含的其他CSS 文件的任何属性。我将尝试通过以下几行使其更清楚。我期待这样的事情。

<html xmlns = "http://www.w3.org/1999/xhtml" xml:lang = "en" lang = "en">
    <head>
        <link rel = "stylesheet" type = "text/css" href = "main_style.css" />
    </head>
    <body>
        <div class="main">
            <div rel = "stylesheet" href = "sub_style.css"> <!-- This with seperate stylesheet.-->
                <!--
                Elements here will have style only from sub_style.css and not from main_style.css
                -->
            </div>
        </div>
    </body>
</html>

编辑：如果使用 DIV 无法实现，我们可以使用 iframe 来实现吗？

【问题讨论】：

创建您自己的类，它在main_style.css 中没有被引用，并在sub_style.css 中对其进行样式设置。在此之前您可能想要对其进行规范化。

标签： html css iframe frame

【解决方案1】：

简短的回答是NO，如果你想防止div 继承其他样式表的样式，唯一的办法是通过使用更具体的选择器或使用!important，我更喜欢这里的特定选择器。

例如，您在样式表 1 中有类似以下 sn-p 的内容

div {
   color: #f00;
   font-weight: bold;
}

你已经在样式表 2 的下方

div {
   font-weight: normal;
}

在这种情况下，div 的字体将是正常的，因为它已被覆盖，但颜色将是 #f00，为了有其他颜色，您需要在 stylesheet 2 中指定 color太……

如果您想专门针对div，我建议您使用唯一的id，然后为该特定div编写各自的样式

例如

<div id="unique_element"></div>

div#unique_element {
   /* Define styles here, or override the previous */
}

这样，使用id你的特异性会更大程度的增加，你也可以针对特定的div

当你编辑你的问题时，如果你想使用iframe而不是yes，你可以在该文档中使用<style>块并设置div的样式

【讨论】：

【解决方案2】：

您不能将 CSS 文件链接到 div。但是，通过与适当的选择器一起使用ID（＃）或类（。），您可以为该Div元素创建独立样式。

【讨论】：