Sass - &引用父選擇器

 

描述: 
您可以使用＆字符選擇父級選擇器。 它告訴父選擇器應該插入的位置。 


例一：&在前 

h3 {
  font-size: 20px
  margin-bottom: 10px
  &.some-selector {
    font-size: 24px
    margin-bottom: 20px
  }
}

輸出CSS： 

h3 {
  font-size: 20px;
  margin-bottom: 10px;
}
h3.some-selector {
  font-size: 24px;
  margin-bottom: 20px;
}

例二：&在后 

h3 {
  font-size: 20px
  margin-bottom: 10px
  .some-parent-selector & {
    font-size: 24px
    margin-bottom: 20px
  }
}

輸出CSS： 

h3 {
  font-size: 20px;
  margin-bottom: 10px;
}
.some-parent-selector h3 {
  font-size: 24px;
  margin-bottom: 20px;
}

轉載請注明， 
原文出處：http://lixh1986.iteye.com//blog/2428306