CSS：root选择器

CSS中的此伪类与文档的根元素匹配。它选择文档树或DOM中的最高级别的父级。

在HTML中，元素始终是根元素。尽管：root等同于html选择器，因为它们都针对相同的元素，但：root选择器具有更高的特异性。

句法

:root {
    // CSS property
}

例

 
 
     
         
         
     
     
        
Welcome to the javaTpoint.com
 
        
This is an example of :root selector
 
     
 

现在，让我们同时尝试html选择器和：root选择器。尽管它们的工作原理相似，但就特定性而言，：root选择器获胜。

例

在此示例中，我们将在html选择器和：root选择器中定义相同的属性。 ：root选择器中的属性将因具有更高的特异性而起作用。但是那些不在：root选择器中但在html选择器中提到的属性，则html选择器的属性将起作用。

例

 
 
     
         
         
     
     
        
Welcome to the javaTpoint.com
 
        
This is an example of :root selector and html selector
 
     

在上面的示例中，我们可以看到html和：root选择器都提到了background-color和color属性，但是在输出中，：root选择器中提到的属性将起作用。这是因为：root选择器的特殊性。