Stylus是一個CSS程式碼預處理器，它使我們能夠在文字編輯器中更輕鬆地工作，以下我將解釋我這樣說的原因。
我們知道這是一個樣式表：
身體{font：12px Helvetica，Arial，sans-serif; } a.button {-webkit-border-radius：5px; -moz-border-radius：5px; border-radius：5px; }
這是用Stylus 建立的同一個樣式表：
正文字體12px Helvetica，Arial，無襯線a.button -webkit-border-radius 5px -moz-border-radius 5px border-radius 5px
鍵盤上的按鍵呢？分號和冒號都去哪了？全都遺忘了。觸控筆幫我們搞定了。
如果你剛開始學習CSS和HTML，不建議使用Stylus，因為你可能會忘記它們的實際運作原理。但如果你已經在這個領域工作了一段時間，並且想要節省一些程式碼和精力…那就試試看。
Python程式設計師會發現Stylus與他們習慣的方式非常相似，他們只需要正確縮排即可實現神奇的功能。
安裝
要讓Stylus正常運作，我們需要安裝Node.js，它位於 Community 分支中，所以我們接下來進行安裝：
$ sudo pacman -S nodejs
然後我們安裝手寫筆。 傳統方式是：
$ npm install -g stylus
它可以很好地安裝，但是對我不起作用，因此從AUR安裝起來要容易得多：
$ yaourt -S nodejs-stylus
手寫筆的使用方法
好了，我們已經安裝了Node.js和Stylus。該如何使用它們？很簡單。假設我們有一個目錄，其中包含以下檔案：
-目錄-index.html-style.css
我們需要建立style.style文件，我們將要使用的文件就是它。在這個文件中，我們可以加入類似這樣的內容：
正文背景顏色#ffff字體大小12px a。按鈕顏色紅色填充10px
如果我們儲存或進行任何更改，都不會發生任何事情，因為我們並沒有「編譯」檔案。要編譯它，我們需要在目錄（style.styl檔案所在的目錄）中開啟終端並執行以下命令：
stylus -c style.styl
但是每次保存style.styl檔案時，我們都必須運行程式碼，但幸運的是，這並非必要，因為如果我們運行相同的命令，但添加-w（監視）參數，則會發生以下情況：
手寫筆-c -w style.styl觀看/usr/lib/node_modules/stylus/lib/functions/index.styl編譯的style.css觀看的style.styl編譯的style.css編譯的style.css
換句話說，文件會自動編譯..結果會是嗎？
正文{background-color：#fff; font-size：12px} a.button {color：＃f00; padding：10px}
如您所見，它不僅產生了我們的CSS程式碼，還刪除了不必要的空格，從而減輕了樣式表的大小。
不僅如此，Stylus還允許我們將 CSS 檔案轉換為其格式，而且它的語法用法極為豐富。這只是冰山一角。所以，如果您有興趣，我鼓勵您深入了解Stylus。