指南针output_style

Question

有没有人找到任何关于Compass中output_style的不同值的含义的文档？选项包括：expanded，：nested，：compact和：compressed。我可以看到最后一个是什么，但其他人做了什么？

似乎有点浪费，我必须重新编译我的所有CSS，以弄清楚这些不同的选项产生了什么。

Answer 1

输出样式包含在SASS documentation。

中

  

虽然Sass输出的默认CSS样式非常好用   反映了文件的结构，品味和需求各不相同   Sass支持其他几种风格。

     

Sass允许您在四种不同的输出样式之间进行选择   设置：style选项或使用--style命令行标志。

     

：嵌套

     

嵌套样式是默认的Sass样式，因为它反映了   CSS样式的结构和它们造型的HTML文档。   每个属性都有自己的行，但缩进不是常量。   每个规则都根据嵌套的深度缩进。例如：

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

.huge {
  font-size: 10em;
  font-weight: bold;
  text-decoration: underline; }

     

在查看大型CSS文件时，嵌套样式非常有用：它允许   你可以轻松掌握文件的结构，而无需实际阅读   任何东西。

     

：扩展

     

Expanded是一种更典型的人造CSS样式，具有每个属性   并且规则占据一条线。属性在规则中缩进，   但规则并没有以任何特殊的方式缩进。例如：

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

.huge {
  font-size: 10em;
  font-weight: bold;
  text-decoration: underline;
}

     

：紧凑

     

紧凑风格比嵌套或扩展占用更少的空间。它也是   将重点更多地放在选择器上而不是它们的属性上。每   CSS规则只占用一行，并在其上定义了每个属性   线。嵌套规则彼此相邻放置，没有换行符，   虽然不同的规则组之间有换行符。对于   例如：

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

.huge { font-size: 10em; font-weight: bold; text-decoration: underline; }

     

：压缩

     

压缩风格占用尽可能少的空间   除了分隔选择器和a之外必需的空格   文件末尾的换行符。它还包括一些其他未成年人   压缩，例如选择颜色的最小表示。   它并不意味着人类可读。例如：

#main{color:#fff;background-color:#000}#main p{width:10em}.huge{font-size:10em;font-weight:bold;text-decoration:underline}

Answer 2

啊，我现在得到它...：扩展是默认值：

：扩展

#date .day {
  display: block;
  padding-top: 5px;
  font-size: 30px;
  color: #AAA;
}

：嵌套

#date .day {
  display: block;
  padding-top: 5px;
  font-size: 30px;
  color: #AAA; }

：紧凑

#date .day { display: block; padding-top: 5px; font-size: 30px; color: #AAA; }

：压缩

#date .day{display:block;padding-top:5px;font-size:30px;color:#AAA}