以前看到php變量的定義，直接使用$符號開始，怎麽看都不習慣。後來呀，在使用Emmet的過程中，又接觸到了$符號。今天，在學習Sass的過程種，再一次接觸到$符號，興致所致，不由得想寫一篇，對比一下搞不懂的$符號設計。

1. Emmet

div.item-$*5{haha}

$*5 被對應的替換為1，2，3，4，5

2. Sass

生成item-1, item-2, item-3, item-4, item-5 這5個類，$i，即$1, $2, $3, $4, $5 分別代表一個變量名，插入選擇器中

輸入sass命令： sass input.scss output.css --style expanded， 編譯後，生成的output.css css類如下：

在index.html中引入output.css：

運行效果如下：

3.總結

$1, $2, $3, $4, $5代表變量，Emmet相當於直接執行了一個循環語句，Sass也是通過腳步的方式，編譯後，執行了一個循環語句，原理是相通的。

那些不明不白的$符號設計--Sass和Emmet，變量設計原理相通