大致樣式：每個(gè)按鈕由上下兩部分組成，上半部分實(shí)現(xiàn)鼠標(biāo)滑過－放大并且旋轉(zhuǎn)，下半部分市縣鼠標(biāo)滑過－背景顏色變化，帶有四個(gè)線條動(dòng)畫，并且顯示提示文字
transform 轉(zhuǎn)變
該屬性對(duì)元素進(jìn)行2D或3D轉(zhuǎn)換，允許我們對(duì)元素進(jìn)行旋轉(zhuǎn)，縮放，移動(dòng)或者傾斜。
舉例：
transform: rotate(360deg) scale(1.2);transform是綜合屬性， 后面的rotate和scale是附帶屬性，這些附帶屬性之間用空格隔開！
兼容問題：
為了兼容這些瀏覽器，要加上這些內(nèi)核：
transform: rotate(360deg) scale(1.2);
-ms-transform: rotate(360deg) scale(1.2);
-moz-transform: rotate(360deg) scale(1.2);
-webkit-transform: rotate(360deg) scale(1.2);
-o-transform: rotate(360deg) scale(1.2);
transition 過渡
注意！！ transition寫在動(dòng)畫之前，也就是原始狀態(tài)CSS的類！！動(dòng)畫之后的狀態(tài)類至寫改變之后的代碼?。?/p>
該屬性是簡(jiǎn)寫屬性，有四種附屬屬性，是用來過渡的。--> 有了這個(gè)屬性，像transform之類的動(dòng)畫才會(huì)有過程（本例子中，沒有這個(gè)transition屬性，鼠標(biāo)滑過按鈕時(shí)，只會(huì)看到突兀的放大效果，而去看不到轉(zhuǎn)動(dòng)的效果，因?yàn)闆]有過程，所以轉(zhuǎn)動(dòng)的效果相當(dāng)于沒有！）
transition-property, transition-duration, transition-timing-function, transition-delay
transition-property: 取值可能為all/空，特定的屬性比如widthtransition-duration: 取值可能為秒XXXs或者毫秒XXXmstransition-timing-function: 取值可能為（1）
linear：規(guī)定以相同速度開始至結(jié)束的過渡效果，等于 cubic-bezier(0,0,1,1)（2）
ease：規(guī)定慢速開始，然后變快，然后慢速結(jié)束的過渡效果，等于cubic-bezier(0.25,0.1,0.25,1)（3）
ease-in：規(guī)定以慢速開始的過渡效果，等于 cubic-bezier(0.42,0,1,1)（4）
ease-out：規(guī)定以慢速結(jié)束的過渡效果，等于 cubic-bezier(0,0,0.58,1)（5）
ease-in-out：規(guī)定以慢速開始和結(jié)束的過渡效果，等于 cubic-bezier(0.42,0,0.58,1)（6）
cubic-bezier(*n*,*n*,*n*,*n*)：在 cubic-bezier 函數(shù)中定義自己的值?？赡艿闹凳?0 至 1 之間的數(shù)值。兼容問題：
box-sizing
CSS3之前的盒子模型不夠靈活，CCS3推出的新屬性box-sizing，取值范圍為content-box，border-box，inherit
兼容問題：
舉例：
元素總寬度為180px
box-sizing: border-box;
-ms-box-sizing: border-box;
-o-box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
width: 180px;
border-radius
border-radius是一個(gè)簡(jiǎn)寫屬性，用于設(shè)置四個(gè)border-XXX-radius屬性（XXX=left, top）
兼容性：
以下瀏覽器皆支持該屬性！
