Sass - &引用父选择器

 

描述: 
您可以使用＆字符选择父级选择器。 它告诉父选择器应该插入的位置。 


例一：&在前 

Css代码  

1. h3 {  
2.   font-size: 20px  
3.   margin-bottom: 10px  
4.   &.some-selector {  
5.     font-size: 24px  
6.     margin-bottom: 20px  
7.   }  
8. }  

输出CSS： 

Css代码  

1. h3 {  
2.   font-size: 20px;  
3.   margin-bottom: 10px;  
4. }  
5. h3.some-selector {  
6.   font-size: 24px;  
7.   margin-bottom: 20px;  
8. }  

例二：&在后 

Css代码  

1. h3 {  
2.   font-size: 20px  
3.   margin-bottom: 10px  
4.   .some-parent-selector & {  
5.     font-size: 24px  
6.     margin-bottom: 20px  
7.   }  
8. }  

输出CSS： 

Css代码  

1. h3 {  
2.   font-size: 20px;  
3.   margin-bottom: 10px;  
4. }  
5. .some-parent-selector h3 {  
6.   font-size: 24px;  
7.   margin-bottom: 20px;  
8. }  

转载请注明， 
原文出处：http://lixh1986.iteye.com//blog/2428306