使大量Css风格定义情景化的最佳方式是什么？

Question

我们正在开发一个使用Css作为样式机制的Html控件。这个小部件必须是独立的，这样它才不会干扰主机网页上的任何其他组件。

我们有一个Css文件，其中包含大量的样式定义。为了contextualise他们，每一个与主控件容器的名称开始...

#MainWidgetContainer .class1..... 
{...} 

#MainWidgetContainer .class2..... 
{...} 

有没有我可以申请MainWidgetContainer背景下更具全球性的方式呢？

注 - 可能被挑剔。我可以用它的方式生活，但我认为这值得提问。

Answer 1

在这种情况下，我认为你的唯一真正的选择是使用#MainWidgetContainer ID在你所有的选择。任何比这更通用的风险与主机样式表相冲突，或者不会被您的样式拾取。如上所述，您可以使用LESS或SASS以这种方式减少书写的繁琐操作，但是您的样式仍需使用该选择器。

Answer 2

Here's the documentation on using selectors。你可以使用mainwidget容器的子项。这不是最直观的选择，但它是一个真正的时间这样的东西。

Answer 3

看看LESS：http://lesscss.org/