如何将多个CSS选择器应用于特定div?

nao*_*ota 3 css

我正在创建一种CMS.在这个系统中,每个编辑器都可以定义自己的CSS,如下所示.这种风格应该适用于他们自己的文章.

<style>
p{
color:blue;text-align:center;
}
a{
color:red;
}
</style>
Run Code Online (Sandbox Code Playgroud)

在这种情况下,这些样式必须应用于特定的div id="editors_area".

<body>
    <div id="editors_area">
        ===Styles should be applied only here.===
        Each editors article are displayed in this area.
    </div>
    ===Styles should NOT be applied here.===
</body>
Run Code Online (Sandbox Code Playgroud)

为了达到这个目的,我有一个计划插入#editors_area编辑器的CSS,作为服务端的后代选择器,如下所示.

<style>
#editors_area p{
color:blue;text-align:center;
}
#editors_area a{
color:red;
}
</style>
Run Code Online (Sandbox Code Playgroud)

但我想有更简单的方法可以达到上述要求.

编辑 我删除了javascript代码.哪个不适合这里.

任何想法将不胜感激.提前致谢.

Ror*_*san 5

CSS就是为此而设计的,所以你的第一个方法是正确的 - 更不用说你拥有的jQuery方法是行不通的.

只有css在页面加载后才需要使用jQuery来更改属性,即使这样你也应该使用addClass()或者removeClass()在CSS文件中定义这些类.这是一个更好的关注点分离.