Please enable JavaScript.
Coggle requires JavaScript to display documents.
Stylus (是什麼? (優劣分析 (優點 (可緩解多瀏覽器相容造成的冗餘, 提高效率,節約成本., 使CSS開發更加靈活,…
Stylus
是什麼?
基於Node.js的CSS的預處理框架
誕生於2010年
以近似指令碼的方式去寫CSS程式碼
優劣分析
優點
可緩解多瀏覽器相容造成的冗餘
提高效率,節約成本.
使CSS開發更加靈活
解決樣式覆寫的問題,尤其是mixin式複用
缺點
開發過程增加步驟
增加學習成本
官方資源
Github
https://stylus.bootcss.com/
如何使用?
語法
基本
預設使用 .styl 的作為副檔名
使用縮排控制來代替花括號
使用逗號或換行為多個選擇器同時定義屬性
接受標準的CSS語法
變數
可以減少程式碼冗餘,提高靈活度
宣告變數沒有任何限定,可以使用“$”符號開始,結尾的分號可有可無
變數名和變數值之間的等號是必須的
不要使用“
”符號開頭宣告變數
可以指定表示式為變數,變數甚至可以組成一個表示式列表
存在生命週期,也就是Scope
運算
邏輯控制
迴圈是通過for/in表示式
巢狀
Mixins
函式
繼承
匯入