CSS 3.0 Maker 線上 CSS 3.0 語法產生器 Cascading Style Sheets 簡稱 CSS,這種可應用在網頁(HTML)或 XML 裡的結構式語法,能讓網頁在排版時呈現多樣式的變化、美觀網頁裡的元素(字型、字體、顏色、間距...)使其每個元素可以有自己的呈現方式,可說是網頁的排版師,也是每個網頁設計師必學課題。目前 CSS 的標準也從1.0、2.0 進展到最新的 3.0,提供了更多的樣式及效果,讓網頁可以變得更生動,對於某些要呈現的網頁效果也省去了使用像是 Flash 或是其它美工軟體來製作。CSS 3.0 Maker 就是一個相當好應用的 CSS 3.0 線上 CSS 語法產生器,對於所需要的效果,可利用其產生器進行調整設定,便能產生出針對各家瀏覽器的支援度所需要的 CSS 3.0 代碼。CSS 3.0 Maker 可產生網頁效果如下: Border Radius - 圓角框 Gradient - 漸層顏色 CSS Transform - 變形 CSS Animation - 動畫 CSS Transition - 改變效果 RGBA - 顏色透明效果 Text Shadow - 文字陰影 Box Shadow - Box 陰影 Text Rotation - 文字旋轉 @Font Face - 字型外觀 CSS 3.0 Maker 網站資訊網站語言:英文網站網址:按我前往 CSS 3.0 Maker 訂閱關鍵應用,軟體應用技巧再升級 如何使用 CSS 3.0 Maker? 將這篇文章快速佈署到你的網站 1.進入 CSS 3.0 Maker 網站後,先來了解其操作介面,上方的 Menu 可選擇要設定的樣式,左上角的 CSS3 Styles 可以做細部樣式設定,畫面中間有個預覽區可看到調整後的效果;右邊的 CSS3 Codeview 則是CSS的原始碼,產生後可以直接複製到剪貼簿裡或是點擊[Download]來下載已壓縮過的 HTML 檔到自己的電腦中。 2.Border Radius - 圓角框,可以設定將外框加上圓角,並可設定四個角的圓角角度、外框的線條樣式、顏色。其所產生的語法可支援的瀏覽器有 Firefox 3.5+、IE 9+、Safari 3.0+、Opera 10.5+、Chrome 4.1+,行動裝置上可 BlackBerry 6+ 及 iOS 1.0+。 3.Gradient - 漸層。 4.CSS Transform - 變形。 5.CSS Animation - 動畫,設定好之後,可點擊[View Animation]來觀看動畫效果。 6.CSS Transition - 改變效果。 7.RGBA - 顏色透明效果。 8.Text Shadow - 文字陰影。 9.Box Shadow - Box 陰影。 10.Text Rotation - 文字旋轉。 11.@Font Face - 字型外觀。 相關文章 loading.io 可產生 CSS、SVG、GIF 的網頁 loading 動畫圖示產生器線上 HTML、CSS、JavaScript 程式碼產生器,超多範例語法Grid-Generator 可自訂網頁結構的版型產生器MarkdownPad 將文件快速轉換成 HTML / XHTML 的網頁格式網頁框架線上產生器