首页 > 技术文章 > Sass - &引用父选择器

500m 2019-10-10 23:04 原文

 

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


例一:&在前 
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 

推荐阅读