将CSS应用于页面的特定部分

Question

我需要将预先存在的样式表仅应用于特定div中的元素，这可能吗？

漫长而漫长的原因：我们有一个带有css文件的页面片段。我们现在想要将此页面片段包含在另一个页面中。这样做很容易，但它的CSS和新页面的CSS冲突。大量编辑样式表很困难，因为它们都很大并且需要保持与之前的兼容性。这让我想到了上面的问题。

Answer 1

你知道http://lesscss.org/吗？ 它支持嵌套规则 你可以将你的整个新css嵌套在一个新的规则中（来自div的类），如：

div#the-new-div{
   div{

   }
   /*** your entire css ***/
}

less会将其编译为div#the-new-div div{...}
我知道你可能不希望在你的网站中实现更少的内容，但是有这样的独立编译器：http://digitalpbk.com/less-css/less-css-compiler-windows-lesscexe。然后只需插入已编译的css

Answer 2

在页面上放置一个IFRAME并将片段加载到其中。

<iframe id="section" src="fragment.html"></iframe> 

Answer 3

不，你不能。

您需要更改<div>中应使用的CSS。例如：

向id添加<div>，例如<div id="foo">并在您要用于<div> #foo的样式表中为CSS规则添加前缀。

<强>缺点： 您需要将相同的id添加到其他网站的html标记。