Sassメモ：&でセレクタ連結

a {
  color:#09c;
}
a:hover {
  color:#069;
}
a:visited {
  color:#036;
}
a.btn {
  background:#09c;
  color:#fff;
}

こんなCSSを出力したい場合、Sassの記述は下記になります。

a {
  color:#09c;

  &:hover {
    color:#069;
  }
  &:visited {
    color:#036;
  }
  &.btn {
    background:#09c;
    color:#fff;
  }
}

&を付けることで親の宣言にスペースなしで連結できます。
&を付けないと下記のようにスペースが開いてしまい、入れ子宣言の扱いになってしまいます。

a {}
a :hover {}
a :visited {}
a .btn {}