迎接倒數的最後一發,我說過明年要試著寫一本書,所以,我打從 PHPConf 結束之後就一直在計畫著。既然我覺得 CSS
這樣的東西這麼難以被接受,那麼,是不是應該試著讓他能夠更容易一點的被接受。所以,我就寫了需要一點門檻的東西(被揍飛)。
龍哥跟我說,對於程式設計師來說,讀起來可能不會覺得很吃力,但是可能對於 CSS
不甚了解的人,或是視覺設計師來說,這些東西有點過份生硬。不過,我覺得這真的是一個很困難的地方,要把經驗訴諸於文字其實挺困難的。就像是你要視覺設計師告訴你
那是什麼感覺是一樣的道理。
就像是 NZMA 跟我說,就像你叫我解釋什麼叫做呼吸,經驗累積大概就類似這種感覺吧。
所以,
先來一下國語正音班。
> 數數,第一個字唸數,三聲數,第二個字唸數,四聲數。
最近因為在做 TOC 所以就把這個陳年的東西拿出來講一下,順便趁著是芥末日之前把一些筆記寫一寫,不然現在不寫,就只能明年才寫得完了(這個哏你要用幾次)。
我們在撰寫很長篇的文章的時候,常常需要主標題,副標題這一類的東西。但是最麻煩的地方在於,我如果中途一時興起多開了一個標題,那麼接下來的標題順序就悲劇了。
1. 我是第一章
a. 我是第 1.1 章
2. 我是第二章
a. 我是第 2.1 章
俗話說得好,事不過三,所以大抵上寫到 Part 3 就沒有什麼好說得了(揍飛)。其實 @mixin 的概念並不困難,他是很單純的可以當作是一個函式來用,也可以用
@include 來引入。而,使用 @include 引入的方式跟 @extend 與 Nested @import 其實很類似。
依照慣例,範例先上。
產出結果比較:
請注意輸出結果,基本上 Nested @import 跟 @mixin 的
有了一點概念之後,接下來看的地方是嵌套(Nested)的部份。為什麼不講一些比較特殊的地方?因為那些不過就是一些花招而已(無誤),樣式的基本撰寫才是核心所在。而嵌套的作法由於會影響到
CSS 的樣式權重的關係,所以必須要特別留意撰寫的方式。
首先我們知道,可以用兩種方式來嵌套樣式:
* @import 可以從外部引入 sass 檔案,也可以做樣式內部嵌套(Nexted @import)
* @extend 直接引用已設定的樣式規則。
照慣例,範例先上,菜待會再說。
我們這邊需要兩個檔案,一個叫做 _import.sass,另一個叫做
_extend.sass,