css

網頁中的字型呈現，都是以瀏覽者電腦有安裝的字型為主，因此，即便是網頁製作時，所使用的字體有多美觀，除非瀏覽者的電腦有相同的字型。為解決此一困擾，因此便有網頁字型託管服務，像是 Google web fonts 由 Google 所提供的網頁字型應用服務 便是一例，現在，Adobe 也推出的 Edge Web Fonts 免費網頁字型託管服務，提供超過 500 種以上的免費字型，其中也包含所有在 Google Web Fonts 裡的開放原始碼字型，使用時，只需要將其生成的 JavaScript 語法複製到網站裡，便能以 CSS 的 font-family 方式來使用該字型，相當方便。

想要取得網站所搭配的顏色代碼，最快速的做法就是將網頁擷取成圖片，然後透過圖片編輯器內的取色工具去取得顏色代碼，另外一種就是去讀取該網站內含的 CSS，前者取得的色彩可能有偏差，而後者又很麻煩，但取得的顏色代碼絕對正確，而現在後者這麼麻煩的動作，可以由 alwane.io 這個網站來幫你代勞了，使用者只需要將網址輸入，該網站就會自動幫你擷取 CSS 內所有的顏色代碼，並且將相近的顏色以色塊的方式進行分組呈現，另外，如果是已知的 CSS 或是顏色代碼，也可以直接貼到 alwane.io 網站來分析。

想要轉貼網頁上的圖片，通常在取得圖片的原始網址後來進行轉貼，但對於不熟 HTML 或 CSS 語法的人來說，想要轉貼圖片其實也是種困惱，BigImg.it 網站就提供了免費圖片轉貼語法產生服務，只要取得原始圖片的網址後，就可重新設定圖片尺寸大小及定義圖片顯示位置，並在設定後，產生 iframe 語法，複製該語法就可以貼到自己網頁裡想要顯示圖片的位置。

網頁有需要使用色彩漸層來布置時，有些人會使用圖片來避開因不同瀏覽器對 CSS 支援各有不同的問題，但也有網站採主要瀏覽器才支援的 CSS 語法來支應，Blend-CSS 是一個可以線上產生漸層色彩的 CSS 語法產生器，操作方法非常直覺，透過設計好的左、右可選不同色彩的介面，直接就可混合成漸層色彩，且可直接預覽，滿意後，就可複製其產出的 CSS 語法，放到網頁要應用的地方，相當方便。

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

網站的製作不論是初學程式或已經是高手，可能都會覺得寫 Code 來實現功能會比對網站整體顏色該如何配置來的簡單許多，因為，如何用色才能得滿分，始終是沒有標準答案的，只能說用傳統常見的顏色呢就是中規中矩，若用色大膽，有人欣賞就是創新，沒人欣賞就便垃圾了。當然，我們也可以到 BrandColors 這個網站來參考與了解知名網站是如何進行顏色搭配的，若覺得喜歡，也可下載該網站的用色 CSS 檔案，方便後續的應用。

製作網頁時，難免會有需要讓使用者點擊的地方，若只是用文字來敘述，雖然簡單明瞭，但卻顯得單調，想要放個按鈕圖示，但卻又礙於要使用圖片，牽涉較廣，若有這些問題，可以來試試這個可以說是 CSS 按鈕寶庫的 Buttons 線上 CSS 按鈕產生器，不但提供 Flat、Glow、Rounded、3D、Border、Pill、Circle、Dropdown(下拉選單)、icon、Square、Block 等各式各樣的按鈕，且配色相當豔麗，使用上更是簡單，只需在網頁特定位置，載入相關連結後，複製想要使用的按鈕樣式到網頁想要應用的位置即可。

對初學網頁製作的人來說，當需要對「按鈕」元件進行美工時，若能參考別人寫好的 CSS Code 是一個事半功倍的好方法。Call-to-Action Button Generator 是一個可即時預覽的 CSS 按鈕線上產生器，不但提供按鈕顏色、文字、陰影、ICON 等屬性自訂外，還可自動產生所需的 CSS Code 與 PNG 圖檔，讓使用者方便影用到網頁的任意處，相當方便。

通常在寫軟體的使用幫助文件或是製作電子書的時候，大部分都是使用.CHM 的檔案格式，所以在Windows系統裡當你按下[F1]開啟幫助按鈕時所出現的格式便是CHM，CHM Decoder 這套軟體可以將CHM的檔案格式轉換成HTML格式，並將CHM裡所用到的物件，包含圖片、網頁、CSS及Script全部還原，是一個相當好用的工具軟體。

網站開發免不了都要使用到 JavaScript、CSS、SWF、images 等專屬前端網頁的開發應用，例如 JQuery 程式庫，若自己的網站流量夠大，當然可以將其下載到自己網站上來應用，若想節省自身網站的流量，也可以在網頁裡直接引用有提供 CDN 的網站上的程式庫，像是 Google CDN 或是 Microsoft runs their own CDN，若在前述兩個網站上找不到要應用的資源，可以到 CDNJS 網站上找找看，其穩定性與效能也還算不錯喔。

美工的配色，佔有成品成功的關鍵要素，想要取得好的配色效果，除了經驗外，若能透過工具來協助，取色就更加輕鬆簡單，ColorBug 是一套螢幕的取色碼的免費應用工具，透過拖曳相機圖示，可取到螢幕任何位置的顏色，支援 HEX、RGB 及 Delphi、C++、Visual StudioIDE 等程式的色碼表，除此之外，ColorBug 還有項很特別的功能，就是能製作所選顏色的漸層色，並為該漸層色產生 CSS 樣式表，方便你應用到網頁中。

文書編輯時，如果可以 HTML 化，不但可以透過 CSS 語法進行美化，對於閱讀者來說，也只要使用內建在作業系統內的瀏覽器便可開啟閱讀，優點不少，ConstEdit 就是一套簡易的 HTML 編輯器，使用起來就像使用 Word 般的方便，編輯的文件，除了可以以 HTML 的格式來存檔，亦可以轉成 PDF 或 TXT 文字檔，相當方便。