很多人都會(huì)發(fā)現(xiàn)網(wǎng)速慢的時(shí)候，在瀏覽網(wǎng)站時(shí)候要不耐其煩的等待圖片的刷新，最后還有可能等待出來(lái)一個(gè)叉叉圖片，而這些圖片用Phosotshop制作的，搜索時(shí)候還看不到這張圖，因?yàn)樗阉饕婺J(rèn)這是一張圖片，你哪怕做的再好，只能知道是一張圖。那么，有沒(méi)有一種新的方法可以避免這些缺點(diǎn)呢？

    就像一件事做的步驟多了就容易出現(xiàn)問(wèn)題，我們不得不來(lái)回重復(fù)前面干的動(dòng)作，頁(yè)面語(yǔ)言也一樣，在這種情況下顯得雜亂無(wú)章，非常難以理出頭緒,通過(guò)控制這類(lèi)特效的語(yǔ)言集中到了css中，我們不但保證了頁(yè)面簡(jiǎn)介，還能更方便各類(lèi)語(yǔ)言集合。最新公布的css3及html5特性讓我們心動(dòng)不已啊！

1. 新的內(nèi)容標(biāo)簽

  html4                                                          html5

HTML4中的內(nèi)容標(biāo)簽級(jí)別相同，無(wú)法區(qū)分各部分內(nèi)容。而HTML5中的內(nèi)容標(biāo)簽互相獨(dú)立，級(jí)別不同，搜索引擎以及統(tǒng)計(jì)軟件等均可快速識(shí)別各部分內(nèi)容。

2. 音頻、視頻API

HTML5不但允許你在網(wǎng)頁(yè)中直接整合視頻、音頻，同時(shí)更提供了一套功能豐富的API用來(lái)控制媒體播放，而這些用來(lái)控制媒體播放的元素也都是可以被編輯的。因此，HTML5在視頻以及音頻層面上實(shí)際已經(jīng)可以替代常用的flash插件了。

3. 畫(huà)布(Canvas) API

在網(wǎng)頁(yè)中繪制圖形一直是個(gè)大難題，我們不得不借助flash、silverlight等插件。然而HTML5允許你直接在網(wǎng)頁(yè)上進(jìn)行繪圖，甚至允許你與網(wǎng)頁(yè)生成更多的交互，例如繪制圖形、放大縮小，等等。

4. 拖拽釋放(Drag and drop) API

我們可以通過(guò)HTML5的Drag and drop API來(lái)完成網(wǎng)頁(yè)中的拖拽釋放效果，避免了以往的網(wǎng)頁(yè)在拖拽釋放過(guò)程中需要不停修改元素的位置，代碼繁多的弊端。就跟剪切板差不多。

1. RGBa

CSS3的RGBa新特性允許你對(duì)每個(gè)元素進(jìn)行色彩以及透明度的設(shè)置。而原來(lái)常用的opacity命令只能對(duì)元素及其子元素進(jìn)行設(shè)置。

如：em { color: Rgba(red,green,blue,opacity) }/* 舉例 */em { color: rgba(255,0,0,1) }    /* 紅色，不透明 */em { color: rgba(100%,0%,0%,1) } 

2. Round corners

圓角功能可能是CSS3提供的最實(shí)用的功能了。通過(guò)Border-radius，你可以沒(méi)有任何難度的給指定的HTML元素添加圓角，支持上、右、下、左;border-radius:5px 15px 20px 25px;也支持拆分書(shū)寫(xiě)

3. @font-face

上次在網(wǎng)站中也給大家介紹了如何用字體代表圖片，放大放小都不失真

當(dāng)網(wǎng)頁(yè)顯示某種用戶沒(méi)有安裝的字體時(shí)，CSS3提供的@font-face功能會(huì)自動(dòng)的、默默地幫用戶從網(wǎng)絡(luò)上下載相應(yīng)字體。從而讓設(shè)計(jì)師更加自由的發(fā)揮，而不用考慮用戶的機(jī)器是否安裝了相應(yīng)字體。

4. 其他特性

此外，CSS3還給我們帶來(lái)了漸變、防止字符串過(guò)長(zhǎng)溢出、多重背景以及用圖片來(lái)作為元素邊框等功能。

利用好CSS3，你可以更快捷的得到以往用很多插件才能得到的效果。同過(guò)使用元素本身來(lái)取代大部分圖片，網(wǎng)頁(yè)的加載速度會(huì)得到提升，這些原本是圖片的內(nèi)容，也可以被搜索引擎檢索到。