Question

伙计我正在从一些第三方来源处理复杂的CSS选择器。我无法使用一些东西。

嵌套CSS的工作原理。我看到很多嵌套的CSS，比如。

.firstclass
{
   .someotherclass { }
}

有时。

.firstclass.secondclass
{
   .thirdclass{}
   .fourthclass{}

}

此外，我尝试了下面的示例代码，我的期望是第二个文本框的背景颜色将变为“黑色”，但它没有发生。

<html>

   <head>

   <style type="text/css">

   .style-color
   {
       background-color:#000000;
   }

   #id2_.style-color h1
   {   
       background-color:#F0E68C;
       .apply
       {
           background-color:#000000;
       }


   }
   </style>
   </head>

   <body> 

   <div id="id1" class="style-color"> <h1> <input type="text" class="apply"> </h1> </div> 
   <div id="id2_" class="style-color"> <h1> <input type="text" class="apply"> </h1></div>

   </body>

</html>

Answer 1

这不是一个有效的CSS。如果您看到该代码主要是动态CSS。 SASS和LESS是动态CSS的示例。他们为CSS添加了编程功能。您可以使用SCOUT编译器进行SASS。谷歌吧。

Answer 2

我发现我使用的第三方源代码是在内部使用SAAS。因此我感到困惑。

现在我清楚这一点，所以我将尝试理解SAAS及其工作方式。

CSS选择器的复杂程度如何

2 个答案: