编译的 Sass 将 } 放在最后一行的末尾

Question

我昨晚读了 Sass 之后，今天早上才开始使用 Sass。我想我理解它（但如果您不同意，请随时发表评论）。不过，我遇到了一个问题，无论是轻微的，还是引起强迫症头部疼痛。

ul#primary-nav {
  font: 400 16px $font-stack;
  margin: 0 auto;
  text-align: center;
  li {
    display: inline-block;
    margin: 0 15px;
    &:first-child {
      margin-left: 0;
    }
    &:last-child {
      margin-right: 0;
    }
  }
  a {
    color: $grey;
    padding: 10px 5px 15px 5px;
    &:hover {
      border-bottom: $blue solid 6px;
      .active {
        font-weight: 700;
      }
    }
  }
}

这将输出以下代码：

ul#primary-nav {
  font: 400 16px "Lato", sans-serif;
  margin: 0 auto;
  text-align: center; }
ul#primary-nav li {
  display: inline-block;
  margin: 0 15px; }
ul#primary-nav li:first-child {
  margin-left: 0; }
ul#primary-nav li:last-child {
  margin-right: 0; }
ul#primary-nav li a {
  color: #777777;
  padding: 10px 5px 15px 5px; }
ul#primary-nav li a:hover {
  border-bottom: #25aae1 solid 6px; }
ul#primary-nav li a.active {
  border-bottom: #25aae1 solid 6px;
  font-weight: 700; }

所以代码本身适合我想要的，但我想知道为什么它会在最后一行添加结束段落标签。有没有办法在下面的行上强制它

ul#primary-nav li a:hover {
  border-bottom: #25aae1 solid 6px;
}

我知道这只是一件小事，但它会让我非常高兴。

Answer 1

是的，完全可以满足您的强迫症需求：基本上您需要确保编译器以expanded风格输出。

从文档中：

嵌 套

#main {
  color: #fff;
  background-color: #000; }
  #main p {
    width: 10em; }

扩大

#main {
  color: #fff;
  background-color: #000;
}
#main p {
  width: 10em;
}

从命令中，使用 sass style.css --style expanded 执行此操作，但您的构建系统也可能在某处公开该选项 - 检查其文档。