一个例子弄懂SASS中的 "&"

35 阅读1分钟

&是sass的语法,代表上一级选择器

.bordered {
  &.float {
    float: left; 
  }
  .top {
    margin: 5px; 
  }
}

等同于

.bordered.float {
  float: left; 
}
.bordered .top {
  margin: 5px;
}

.bordered.float 是串联选择器,作用在同一标签上
.bordered .top 是后代选择器,作用在不同标签上