[CSS3 Minefield] CSS3 Background and Border #1 - Multiple Background

寫完一些長文接下來會把一些本質上很零碎的spec分成幾個短篇寫-這次是已經是CR的CSS3 Background and Border [w3c spec]

今天的主題是當中最多人感興趣(也最雷)的Multiple Background

[CSS3 Minefield] Multiple Columns

今天的是簡單一點的CSS3 Multiple columns (w3c: multi-column)。這是網頁排版的重要模組之一，可以排出報章雜誌常用的多欄文章:

[Source: Wikipedia, The Guardian Cover (Fair Use)]

[CSS3 Minefield] Media Queries

延續上回的CSS3火星系列，這次颯爽登場^的是Media Queries!

[前言]
當今世上的顯示平面實在太多－不同大小的手機、不同大小的顯示器、以至不同的媒介(media)，尺寸兩極，一個CSS難以滿足全部平台，於是讓特定的顯示平面+螢幕尺寸來切換CSS的media query應需要而生，在smartphone/iPad+CSS3橫行的年代獲廣泛應用。

Media Queries有兩個組成部分: 媒介種類(Media Type) & 特性(Media Feature)，以下逐一說明。

[CSS3 Minefield] Animation

上次寫過CSS3 Transition這次就寫一下CSS3 Animation－比Transition複雜但可以做出精細特效的終極神器。 (尤其是你要的屬性變更是非線性或不連續的時候)

[前言]
和CSS3 Transition一樣的是，本文只適用於webkit系的Chrome和Safari。 [Browser Support]
本篇會比一篇更傾向解Spec－基本上只要有Flash/Shockwave底子原理不難懂，差的是動畫特性: 流程與機能等。
另外這次的排版也有點不一樣－方便為主，semantics不是不想理是Blogger的系統不給理...
Let's Start。

[CSS3 Minefield] Transition

[本文的Demo請用webkit系的browser如chrome和safari最新版觀看]
前言
1. 偏見不是一天造成的
2. Safari和Chrome在CSS的部分幾乎一致，分野直至Mobile才出現
3. Vendor prefix = 小心被炸
碎碎念完畢，開始。

正文
CSS3 Transition是一種「不自己寫過沒感覺」和「很易被雷到」的東西

在說Implementation前說一下這是什麼東西。