css3

CSS 版本進展到 CSS3.0，讓以往需要靠圖片來輔助才做得到的效果，變得只需用 CSS 即可，例如邊框特效、色彩展示、圖形變化、動畫、轉換特效、文字色彩、文字陰影、區塊陰影、文字旋轉...等，不過標準有了，語法的學習上卻變成是個門檻，還好，線上有很多關於 CSS 產生器，像是按鈕、陰影、圓角...等，如果對 CSS 語法陌生，又想產生圓角邊框，可以來試試 border radius 這個線上的 CSS 圓角框產生器，簡單方便。

以往在網頁想要利用漸層的色彩來美化時，若要使用 CSS 需要考慮地的因素很多，各家瀏覽器所支援的語法也不盡相同，需要不斷的微調，最後乾脆使用圖片一勞永逸。現在 CSS3 開始普及，想要使用漸層色彩，越見方便，CSS Gradient Background Maker 是微軟所推出利用 CSS 語法漸層背景產生器，只要選好顏色，便能產生不同漸層方向，且支援 IE、Mozilla Firefox、Opera、Safari/Chrome 等瀏覽器的 CSS 語法。

以前想要讓網頁有動畫效果，多數要靠 JaveScript、GIF 或是 Flash，而現在則可以透過 CSS 3，不過想要透過 CSS 3 語法來做動態特效，其學習門檻著實不低。但若只想在網頁放一些較為簡單的特效，可以來參考 CSS3 Animation 這個網站所提供的 CSS 3 動畫語法免費範本，下載後，只要經過簡單的語法加工，就能套用範本，讓自己的網頁輕鬆動起來。

CSS 是用來控制網頁的布局與樣式，對圖檔與動畫的支援都不多，因此，大家看到網頁所呈現的圓角、陰影、漸層、半透明...等特殊效果，幾乎都由圖片來完成，當然網頁載入的速度也就會慢一些，而 CSS3 除了 CSS 原有的屬性外，大幅增加對圖像與動畫的語法支援，以前要用圖片處理的圓角、漸層、陰影...等等，都可以靠 CSS3 來完成，另外，為增加網頁的可看與互動性，CSS3 的動畫屬性，也讓製作者減輕製作的成本，更讓觀看的用戶，免去瀏覽器安裝擴充程式所帶來的資安風險與惡意程式的假藉更新名義實則進行勒索攻擊等問題。CSS3 立意很好，但對初學者來說門檻很高，我們可以透過像 CSS Animate 這類的線上免費工具，加快我們的學習並製作出具水準的動畫。

想要在網頁上呈現一個按鈕元件，為避免瀏覽器相容性問題，通常就會使用文字或背景圖片來呈現，而利用 CSS3 可以幫助網頁即使不用圖片亦能達到類似圖片的效果甚至更多，CSS3 Button Generator 是一個 CSS3 按鈕線上產生器，內建多種樣板，選中喜歡的樣板，稍微修改下便能應用到網頁中，相當方便。

微軟的 Internet Explorer 9.0 網路瀏覽器正式版推出，提供了 GPU 硬體加速機制，全新的 JavaScript 引擎，也全面改善軟體運作效能，讓 IE 9.0 在瀏覽網頁時，擁有高流暢度與網頁的展示速度，不但軟體啟動速度更快，操作介面也改得更簡潔、好操作，且在網址列除了原本可以打網址、開網頁之外，還可以直接當搜尋引擎使用；在安全性的加強方面也加入反制隱私權洩密的「追蹤保護」、「ActiveX 篩選」與更完善的附加元件管理功能…等；IE9 支持最新的 HTML5、CSS3、SVG 和 DOM L2&L3...等；不過這麼多、這麼好的功能只能應用在 Windows 2008 Server、Vista 或 Windows 7 的作業系統上，似乎可惜了些。

已在使用 Windows 8 的用戶，其內建的瀏覽器版本 Internet Explorer 10，然而對於使用 Windows 7 或 Windows 2008 Server 的用戶來說，現在也可以開始升級 IE 10版本，IE10 帶來了完整的硬體加速支援，使用 Chakra JavaScript 引擎，可為 Windows 7 帶來更快速順暢的網路瀏覽體驗，同時，IE10 也支援更多 HTML5 以及 CSS3 標準，也是首款預設開啟不追蹤(Do not Track)功能的瀏覽器。

網頁處理、運算、傳輸都需要時間，如果讓使用者乾等待，就容易產生當機的錯覺，因此，在這段時間產生一個提示訊息藉此告訴使用者耐心等待是有必要的，而現行網頁最常見的就是使用等待動畫圖示，負責處理到呈現這段時間的呈現，這個動畫可以使用 GIF 圖檔，也可以使用純 CSS 語法打造，24 PURE CSS3 PRELOADERS 這個網站展示了 24個純 CSS 等待動畫圖示，只需在網頁中引用該 CSS 檔案，就可輕易實現等待中使用動畫圖示來提示。

在瀏覽網頁的時候，常會看到 loading 動態圖示，尤其是在需要較長時間才能回應的操作上，像是線上影片的觀賞、資料量較大的網頁......等等。想要取得這樣的動態圖示，可以自己製作或是透過 cssload.net 這個免費的網站服務，除了可以利用其提供的 loading 圖示，還可以利用其所提供的工具來編輯該圖示，以取得由 CSS3 語法組成的動畫，來取代 Gif 的動態圖示的缺點，期達到最符合自己網站的要求。

對學習 CSS 來說，不論是初學或是要進階，有可以參考的語法是相當重要的，畢竟各家瀏覽器支援的 CSS 語法不見得相同，CSS Portal 是一個提供網頁常用到的 CSS 的語法產生器，包含 CSS Box Shadow、CSS Button、CSS Gradient、CSS Flip Switch、CSS Menu、CSS3 Menu、CSS RGBA、CSS Ribbon、CSS3 Rounded Corners、CSS Sprite 、CSS Text Rotate、CSS Text Shadow 、CSS Tooltip 、Layout 、Style Input Range 讓你在製作網頁時，可以即時預覽樣式與語法。

漸層色較單一顏色來的有層次感，也深受美工人員的愛用，要用 CSS 做出漸層色，不難，但難在顏色如何搭配，這讓人很傷腦筋的，WebGradients 這個網站提供 180個已經配好色的漸層色彩，並提供 CSS3 語法與 PNG 圖檔，不論是個人或商業均可免費取用。

使用 CSS3 可以不需要使用圖片就能呈現出像是光暈、陰影、漸層、圓角....等等的各種網頁特效。但寫 CSS3 是件需要有耐心的事，不但語法長、同一特效還不是各家瀏覽器都能適用(各家瀏覽器還有版本之分)，相當麻煩。若想使用 CSS3 所帶來的方便，但又想省去學習的過程，可以來使用 Simplest CSS3 Generator 這個免費的網路應用程式服務，快速利用 CSS3 建立出適合自己網頁使用的特效，剔除以往需使用圖片的效果，加快用戶的瀏覽體驗。