什麼是CSS3，SASS，SCSS，指南針，少，波旁威士忌

> CSS，SASS，SCSS，Compass，Simelt和Bourbon：快速比較

本指南提供了CSS3和幾個流行的CSS預處理器的簡潔概述。 對於初學者，我們強烈建議您從Compass！

開始

> css3：

>

• >最新版本的級聯樣式表。
• 提供了動畫，過渡和轉換等高級功能。
>
• 學習CSS3css3 demo

css3文檔

> sass＆scss：

• sass（語法上很棒的樣式表）：A CSS擴展功能提供嵌套，變量和Mixins等功能。 使用凹痕進行語法。服務器端處理（通常使用Ruby）。

scss

（Sassy CSS）：在功能上與SASS相同，但使用帶有捲曲括號的CSS樣語法。 sass網站 scss documentation

sass安裝

>示例：

<code class="language-css">/* CSS */
li {
  font-family: serif;
  font-weight: bold;
  font-size: 1.2em;
}

/* SCSS */
li {
  font: {
    family: serif;
    weight: bold;
    size: 1.2em;
  }
}

/* SASS */
li
  font:
    family: serif
    weight: bold
    size: 1.2em</code>

指南針：

• 構建基於SASS的CSS框架。
• 提供了有用的混合素，跨瀏覽器兼容性功能和版式模式的庫。
• >簡化了精靈的生成。

>通過命令行輕鬆更新。

指南針網站指南針demo

指南針安裝1

指南針安裝2

>示例：

<code class="language-scss">#opacity-10 {
  @include opacity(0.1);
}</code>

指南針代碼：

<code class="language-css">/* For IE */
#opacity-10 {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=10);
  opacity: 0.1;
}

/* For other browsers */
#opacity-10 {
  opacity: 0.1;
}</code>

生成的CSS：

• >基於JavaScript的CSS預處理器，處理客戶端。
>提供與SASS相似的功能（嵌套，變量，Mixins）。
• 缺少相當於指南針的框架。

更少的網站

更少的demo 更少的vs sass

>

波旁威士忌：>

>與Codekit和Hammer之類的工具無縫地工作。 >

>波旁威士忌網站

波旁示例 波旁文檔 （請用實際的URL替換包圍的

佔位符。）

以上是什麼是CSS3，SASS，SCSS，指南針，少，波旁威士忌的詳細內容。更多資訊請關注PHP中文網其他相關文章！