SCSS中&的作用

###&可以看作是串联选择器的连接符

##举例

.bordered.float 是串联选择器，作用在同一标签上

.bordered .top 是后代选择器，作用在不同标签上

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

等同于

.bordered.float {
  float: left;
}
.bordered .top {

  margin: 5px;

}

同时，如果想添加hover，比如给要实现.bordered:hover，可以

.bordered {
  &:hover {
    float: left;
  }

即可