今天要介紹的東西，就是最近還滿夯的HTML5，這篇只是從一些基礎的東西開始分享，大概了解基本的觀念而已，之後如果學到更多好玩的東西，再一次分享給大家，不過昨天這樣摸一摸，還滿佩服賈伯斯所帶來當的創意，雖然HTML5還沒有真正完全到答一個標準，不過我想這是遲早的趨勢，一起來看！
今天要講的東西，是最近比較流行的CSS3，平常我們會說做一個網頁是透過HTML+CSS來完成，但CSS的部分，它有分成CSS1、CSS2、以及最近流行的CSS3，不過大家也一直很好奇CSS3到底是什麼，所以今天要講兩個網站，可以幫大家快速上手一些CSS3語法，讓你在使用CSS3上面可以更加得心應手！ 最近有看DOUBLE冠網站的人應該有發現，我的框框是長這樣子的， 這邊我是用一些CSS3語法去產生出來的，但CSS3的語法能在那些瀏覽器使用又是個問題，所以這邊先介紹第一個超好用的網站， CSS3.0 MAKER 網站名稱：CSS3.0 MAKER 網址：按這裡 這款是我覺得很好用的一個網站，它主要可以透過一些簡單介面來產生CSS3語法以外，還會告訴你這個CSS3語法可以在那些版本以上的瀏覽器使用，左邊區塊介面為調整，右邊就是CSS3語法，中間那一區塊就是產生出來的樣子，讓我們一一用它不同功能做測試！ 我們按到上方的”BORDER RADIUS”，這就像DOUBLE冠上面的框框語法一樣，比如我用一個段落來做測試，做得效果像以下這張圖一樣，瀏覽器版本的話，中間產生樣子的下面都是支援的瀏覽器版本喔，IE基本一定要IE9，也就是WIN7才能用IE9，這個要注意一下！ 測試用 HELLO 您好 接下來我們用到TEXT-SHADOW那邊，我想要用像下圖這樣的效果，"TEXT SHADOW"代表著是文字陰影，也就是文字會產生陰影的效果，以往都是用PHOTOSHOP產生陰影，不過用圖多少會拖網站速度，所以CSS3有增加這樣的功能！ 測試用二 HELLO 您好 我們再移到"BOX-SHADOW"那邊，這是整個區塊產生陰影，就像圖所似一樣， 測試用三 之後再為大家講解所謂的翻轉，這邊為大家介紹第二個網站， border-radius 網站名稱：border-radius 網址：按這裡 這邊介紹詳細的框框語法，像這個是可以快速產生各個框框的部分，原理也很簡單，只要調數字就可以了，比如像下圖這樣， 為大家講一下語法意思， -webkit-border-radius: CHROME能看得圓角框。 -moz-border-radius: 12px;:火狐能看得圓角框格式。 border-radius: 12px;；IE能看到的圓角框模式，通用於CHEOME！ 像上圖一樣的效果， 測試用四 以上分享到這邊，有問題再問吧！