正文

和大家聊一下那個我們很熟悉的font-weight屬性-font weight

5424

font-weight屬性。

都用過吧?

用的比較多的值可能是下面這兩個:

normal

bold

其實這兩個值只不過是font-weight的冰山一角。

我們還可以設(shè)置成:

lighter

bolder

甚至還有更細(xì)膩的取值如下所示:

100

200

300

400===normal

500

600

700===bold

800

900

這些各位都明白吧,這些值在使用的時候不可以隨便取的,例如,你一時興起,要來一個font-weight:440。行嗎?當(dāng)然不行。就只能是100到900整百數(shù)。

linghter/bolder到底是個什么情況?

觀看到的上面的取值了嗎?400等于normal,而取值700等于bold。加上頭100,尾900,lighter和bolder是基于這4個臨界點來分析渲染的。仔細(xì)如下

繼承值/bolder/lighter

100/400/100

200/400/100

300/400/100

400/700/100

500/700/100

600/900/400

700/900/400

800/900/700

900/900/700

有的人可能小心到一點,平常項目中無論設(shè)置的是300還是400、500文字的粗細(xì)都沒有所有變化。只有到700的時候才會觀看到的加粗。這是什么原因呢?

事實上,任何這些數(shù)值重要字瀏覽器都是接受的,之所以沒有觀看到的所有細(xì)膩粗細(xì)的變化,是因為我們的系統(tǒng)里面缺乏對應(yīng)粗細(xì)的字體。

也就是說,font-weight要想真正發(fā)揮潛力,問題不在于CSS的接受。而在于是否存在對應(yīng)的字體。

那如果又沒有對應(yīng)的字體文件,我們又想有多檔字重效果,該怎么樣?

答案是:也許font-face可以幫助你。