網(wǎng)頁設(shè)計中最重要的細(xì)節(jié)之一——字體(5)

通過上面的單位介紹，對于 px 單位中，我舉得例子都是 12px、14px、16px、18px等等，為啥不是11px、15px？這涉及到一個鋸齒的問題，特別是在早期的顯示器中，往往不能很好的處理文字的鋸齒問題，而使用單數(shù)的像素，極有可能造成鋸齒，所以默認(rèn)的通常使用偶數(shù)大小。

字體的顏色選擇

字體的顏色選擇同樣是一個重要的細(xì)節(jié)，但是涉及到配色了，已經(jīng)超出本文要討論的范圍，所以在這里，我只好簡單的說一下有關(guān)網(wǎng)頁中字體顏色的禁忌。

字體的顏色要樸素、正常

什么叫樸素正常？通常來說，文章都是白底黑字，黑色的。所以網(wǎng)頁中的文字，通常使用黑色，或者淺灰色，這樣更加符合大眾的口味。如果不是一些很有創(chuàng)意的設(shè)計，請不要隨便的使用顏色。就像 我愛水煮魚 博客里面的一篇文章

如果我為它加上藍(lán)色，你會怎么想？

顏色要與背景有一定的對比度

低對比度，容易導(dǎo)致字體看不清楚。所以要用高對比度的顏色，例如白底黑字，黑底白字等。不信看下圖：

如果你在看一篇文章，字體的顏色是上圖中，最下面的那個，你還會再看下去嗎？

避免特殊顏色

這里要避免的一些特殊顏色，是指網(wǎng)頁中的一些默認(rèn)顏色。特別是藍(lán)色，因為藍(lán)色代表著網(wǎng)頁中的超鏈接，如果網(wǎng)頁中有一段藍(lán)色的文字，會讓人誤以為是可以點(diǎn)擊的超鏈接。所以這種顏色要盡量避免。但是有些時候在設(shè)計中，必須要用到這種顏色的設(shè)計，所以也有一些其他的方法來解決這個問題。

例如潛行者m博客的 Qetro 主題，采用了藍(lán)色調(diào)，在正文排版布局的時候思考過關(guān)于加粗文字的樣式。如果使用常規(guī)的粗體黑色來說，較多的加粗內(nèi)容，會導(dǎo)致頁面文字的混亂。加粗的目的是為了醒目，告訴瀏覽者這是段重要的文字。所以我對文字添加藍(lán)色處理。但是這個藍(lán)色恰巧就跟超鏈接的默認(rèn)樣式顏色相同。非常容易讓人迷惑，于是我將超鏈接的樣式帶有默認(rèn)的下劃線。

當(dāng)用戶看到藍(lán)色的時候，可能會試圖放在上面看一下，結(jié)果無法點(diǎn)擊也沒有變成手指。再往下拉，看到超鏈接的時候，一眼就可以看出下劃線是可以點(diǎn)擊的超鏈接。這也是一種還不錯的折中方法。

與字體有關(guān)的 CSS 屬性

與字體有關(guān)的 CSS 屬性，通常有以下幾個：font-family、font-style、font-weight、fon