繼上編 [網頁介紹]讓您快速的編寫CSS3 的網站 介紹了便利程式碼產生器，方便用於網頁程式碼的編寫，今日再介紹一個網站，也是相同的方式來寫程式，也可以使用這個網站來寫網頁！
推薦網頁：http://www.css3.me/
先來看看網站的首頁吧！
這個網站，較上次介紹的簡單，主要用於邊框的變化，依序分別為邊框的圓角(border-radius)，邊框的陰影(box-shadow)，邊框的背景的漸層變化(background gradient)，最後是邊框的透明度(opacity)。
首先，我們在上圖中的選項1(edit the basics)，可出現以下畫面。
第1項為邊框粗細，第2項為邊框顏色，第3項項為背景顏色
再來，我們將邊框粗細調成5px，邊框顏色設定為紅色
將底色設定成灰色
在右側的Preview (預覽區)，就可以直接看到你的剛剛設定的結果了！
再來開始設定第2項圓角的部份
我們將之設置成30px的圓角
就上出現圓角的產生了！
再來設置第3項陰影的部份
將之設定為17px！
陰影就出現了！
再來我們設置第4項的背景漸層功能
我們將之設定為黃色開始色，白色為結束色
就可以產品以上的效果！
最後，調整透明度，有時我們想有點透明度的效果，可以使內容加點層次或效果，，就可使用該功能
我們將透明100調成49，100為不透明，49為半透明，0就為全透明了
修改完後，就可以看到以上的結果了！
再就是如何將設定好的邊框效果套用在網頁上了！
點上面的 GET THE CODE! 的選項
就會跳出以上的對話框，此時就可以出現程式碼了，還可以選用各式瀏覽的的相容選項，一般而言，我都不會去取消，網頁是要給各式各樣的人看的，而瀏覽器就要有相容性，還是全選比較好，再來就將這些程式碼複制貼上到你的CSS標籤內，再預覽，就可以看到剛剛設定的效果了。
這個網頁，可以方便各位在編寫css 碼時，還要自己邊想邊試，他由預視的功能就可以先看到結果，這可結省不少時間，再者，為了符合各式瀏覽器的相容性，你又要相同的文字一直輸入，此網頁可直接輸出，更可減少輸出的錯誤。
在每個選項後面都有 + 的接鈕，是用於細部修改用的，各位有興趣式或有需要，也可以玩看看喔！
留言列表
