Selectors-Hierarchy

Selectors-Hierarchy

一、Child Selector (“parent > child”)

指定parent元素底下一层必须是child元素。

    
    
    


    
 
 

  
  
        
  
  
aaa
    
 
 

    
 
 

  
  
        
  
  bbb
    
 
 
    

二、Descendant Selector (“ancestor descendant”)

只要父元素是ancestor，而不管是子元素或是下n层孙元素是descendant，都符合选取条件。

    
    
    


    
 
 

  
  
        
  
  
aaa bbbccc
    
 
 

    
 
 

  
  
        ddd
    
 
 
    

三、Next Adjacent Selector (“prev + next”)

选取符合prev元素而紧邻他的下一个是兄弟next元素(注意不是子元素)的条件。

扫描二维码关注公众号，回复： 7264709 查看本文章

    
    
    


    
 
 

        
  
  
aaa
        
  
  bbb
    
 
 

    
 
 

        
  
  ccc
        
  
  
ddd
    
 
 
    

四、Next Siblings Selector (“prev ~ siblings”)

只要是兄元素是prev，而弟元素是siblings皆可选到(可不用紧邻)，

只要是同阶层，并被指定的元素名称都可以被选到。

    


    
 
 

        
  
  
Paragraph 1 in the div.
        
  
  
Paragraph 2 in the div.
    
 
 

    
Paragraph 3. Not in a div.
    
Paragraph 4. Not in a div.

    

请参考CSS-基本格式与选择器(Selector)的第四项第5点。

原文:大专栏  Selectors-Hierarchy