深入淺出 Sass 巢狀

前言

相信許多的後輩,仍前撲後繼的想成為前端工程師
而在這條寫css的路上,一定聽過Sass(預處理css)
其實就是改變平常寫css的習慣
將它變得好整理以及好維護
當然沒有一套最好的標準,畢竟方式都是人制訂出來的
像是隨便搜尋,都一堆人講css命名規範!
甚至很好找到中文解析:(這裡先隨意找一篇)
【YJ BLOG】-Scalable CSS - 介紹OOCSS/SMACSS/BEM
無非是為了易懂的方式撰寫

好的今天主講的是,初探

找一隻檔名為.scss .sass
裡面一定會是很可怕的巢狀

別緊張
你只要了解這個”&
巢狀再複雜也只是個笑話
因為馬上你就會在腦海裡 compile 出 .css

使用預處理 Sass + Compass 快速開發

何謂Sass?

我認為綜合這位大神給的的回覆:
Sass 並不是一套軟體,無法 Download
它算是CSS的進階編寫方式,再透過Ruby環境將檔案編譯成一般CSS檔
而在編寫的過程中 Dreamweaver、Sublime text、Visual Studio、記事本
都只是編寫的工具,並不會影響到編譯後的結果。(部分取自 agito723 CSS沒有極限)
看完還不懂別緊張!!
最完整的Sass解釋,內容不含過多安裝方法,單純 Sass\SCSS 體驗
我給這篇Blog第一名:Sass/SCSS 簡明入門教學

何謂SCSS?

兩者都屬於sass,而差在附檔名以及編寫方式的不同。
.sass是屬於原生的sass語法,明顯的特徵是利用縮排取代大括號。
.scss後來衍生出來的語法,為了讓新加入的設計師可以承受較少的碰撞學習sass,
所以在結構上相當類似CSS。
(取自 agito723 CSS沒有極限)

說實在這個不懂,直接看官網引導最快喔
有Sass跟SCSS的轉換,一看就懂差別再哪了!!

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×