CSS

在網頁中如果要用圖示，例如電話、郵件或是箭頭，以往的做法就是要有該圖示的圖片檔，將其放在指定的位置，但隨著螢幕大小多元化，固定尺寸的圖示圖片檔，缺點盡顯，除了佔用流量外，亦無法滿足螢幕大小的變化，因此將圖示如同網頁字形般的運用，是目前圖示應用在網頁的做法。不論是 Unicode、Icons - Google Fonts 、Font Awesome 都有提供適合在網頁中使用的字形化圖示集，CSS.GG 這個網站同樣提供免費的字形化圖示集，使用者可以自訂顏色、尺寸，再透過其所提供的 HTML，CSS、SVG 或是 TSX 語法就能應用到網頁上。

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

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

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

CSS (Cascading Style Sheets) 這種可層疊的樣式表，被應用在網頁的排版與美觀，對於網頁編輯的初學者來說，大概都會利用網頁元素中的 Style 屬性，直接定義 CSS，因為這樣最直觀也最方便， 若想要學習 CSS 語法時，當然也是能寫完就能即時預覽是最直觀的，CSSDesk 便提供了一個可在線上編輯 CSS 並提供即時預覽的免費服務，讓你所學立即能應用，值得一提的是，一進入 CSSDesk 網站後，其所提供的範例就是一個可四周圓角的 CSS 範例，讓不享用圖片來做圓角框的設計師，可以立即運用。

想要改變按鈕的外觀，在以前我們可能都會使用圖片來代替，現在也可以來試試 CSS-TRICKS 網站所提供的「按鈕 CSS 線上產生器」，只需透過幾個步驟，就能讓按鈕產生圓角框、漸層顏色，另外，亦提供自訂按鈕各個部份的顏色，相當方便，幫助你快速的將網頁內的按鈕套用所產生的 CSS 樣式。

一般的網頁編輯軟體通常都會有 CSS 樣式語法產生器，但若偶而想要對自己的部落格或網頁的文字進行美工調整，可以試試這個 Csstxt 免費的線上文字 CSS 樣式語法產生器，使用上相當簡單，不見得一定要懂 CSS 語法，只要動動滑鼠，輸入幾個參數，就能製作出文字的 CSS 樣式。

對初學者來說要使用 CSS 樣式表來美化網頁時，若遇到不熟悉的語法，其實都可以到 w3schools 來查詢語法與範例，當想要試著自己實作，也可以利用 CssTypeSet 這個網頁式的應用服務來產生文字的樣式表，使用方式就像是使用文書編輯器般的簡單，輕鬆做出文字樣式表。

csswarp 是個可將文字加上自訂的曲線，讓文字隨著曲線加以旋轉、彎曲的 CSS 及 HTML 免費產生器，csswarp 提供相當靈活的操作介面，可自訂文字、曲線、字型、版面大小、位置...等等，而所產生的 CSS 及 HTML 程式碼，可以應用在 Microsoft IE 9、Opera、Firefox 及 WebKit 等瀏覽器。

SVG( Scalable Vector Graphics )可縮放向量圖形，Custom Shape Dividers 這個免費網站，根據所支援的矩形類型，將其製作成只要透過幾個簡單的參數調整，就可產生不同的向量圖形產生器，並提供可以隨裝置不同的解析度而自動調整大小的 HTML 及 CSS 語法，讓用戶可以非常方便的應用到網頁上。

如果不熟悉 HTML 與 CSS ，卻想要將自己所拍攝或蒐集來的圖片，放到網頁上，該如何做呢？Cyotek Spriter 這套免費的應用程式應該可以幫到你，從網頁布局、圖片挑選、CSS 套用、特效等，都可以透過圖形化的介面來操作，完成後，可預覽，並自動產生 HTML 及 CSS 程式碼，省去學習門檻，專注在攝影領域。

Da Button Factory 是一個可以在線上製作網頁按鈕的免費產生器，所產生的網頁按鈕會包含已使用的背景圖片(PNG、GIF、JPEG、ICO)及相對應的 CSS 程式碼可供下載，讓你方便應用在網頁上；Da Button Factory 可讓使用者自訂所要產生網頁按鈕的樣式，亦可參考所提供的網頁按鈕範例再行修改，讓你幾乎不需要有任何美工的技巧，就能輕易做出有水準網頁按鈕。