目標，寫一個類似http://www.jq22.com/js/a7.html效果的頁面
8.18號的cancavs作畫伴隨深入學習了canvas以及線性，圓形顏色漸變，類似背景的原理有着落了，該網頁背景不是用canvas畫的，直接css設置，之後還要講...
今天學習了css3的3d設置，參考該篇文章， http://www.zhangxinxu.com/wordpress/2012/09/css3-3d-transform-perspective-animate-transition/，不得不說，該篇博主實在很猥瑣，嘛，爲了使畫面有立體感，我把從上文學到的以及從其他文章學到的知識應用於簡單的頁面切換，最終目標，創造自己的一片“星空”。
1、簡單說下xyz
CSS3中的transform有多種變換，其中有3d和2d的，3d的rotate都是繞軸旋轉，記住，繞軸，不是繞點旋轉，具體怎麼樣上篇文章介紹得很詳細了，希望看了上篇文章之後再來看一下這章的小tips
2、舞臺，容器，內容的搭建
真的是紙上得來終覺淺，絕知此事要躬行。
1）之前看的時候那博主講舞臺，容器，內容的搭建一晃而過，導致我第一次搭建的時候直接把內容放在了舞臺上，沒有容器，最後會發生一件很坑爹的事情，當你想旋轉整個立體塊的時候只能旋轉舞臺，然後看的地方是舞臺，注意舞臺這傢伙是相當扁的，旋轉到一定角度之後，你已經看不清你放上去的圖了。
所以，舞臺很重要，不能動，想象一下你坐在影劇院裏看錶演，如果臺上的演員旋轉，舞臺也旋轉起來，會是一件非常糟糕的事情。
2）本來以爲容器只是裝圖片的東西不要也罷，殊不知容器將是整個立體物件動起來的核心，是源動力。必須要注意的一點是，因爲把容器設置成了源動力，則需要把容器放置在創建的立體物件的中心位置，不然等容器旋轉起來，畫面實在太美好。如果你發現你的立體物件從左邊轉到右邊然後從右邊轉到左邊，或者從上邊轉到下邊然後再轉回來，肯定是旋轉的核心不在物件的中心位置=。=
3、perspective
當我想找到最佳的perspective時，無論輸入多少px總是不精準的
引用：http://m.blog.csdn.net/article/details?id=39003061
MDN官方文檔說明：
perspective 屬性指定了觀察者與z=0平面的距離，使具有三維位置變換的元素產生透視效果。z>0的三維元素比正常大，而z<0時則比正常小，大小程度由該屬性的值決定。
三維元素在觀察者後面的部分不會繪製出來，即z軸座標值大於perspective屬性值的部分。
默認情況下，消失點位於元素的中心，但是可以通過設置perspective-origin屬性來改變其位置。
屬性值爲0或負值或none（none是默認值）時，沒有透視效果。
只提一點，z=0平面就是屏幕。
4、化腐朽爲神奇的3d轉變
transform-style:preserve-3d;只需要記住，上面那句css是化2d爲3d的東西就好啦。
5、perspective-origin
透視的角度
畫一個立體的六面體，簡單的畫法是前面一個四邊形，後面一個四邊形，然後連線，perspective-origin就是後面那個四邊形的中點相對於前面那個四邊形的中點的位置。