再談如何創建網站字體屬性

作者：佚名   時間：2014-03-14   分享到：

再談如何創建網站字體屬性

創建網站字體屬性如果沒有過多的細節，字體的易讀性和顯示大小主要依靠它的縱橫比（aspectratio）也就是其顯示大小相對于x-height的比例，其中x-height是字體小寫字形高度的測量值。縱橫比接近1.0的字體與縱橫比接近0的字體相比，前者更容易閱讀。同時，由于縱橫比的影響，一種字體的實際顯示大小可能會明顯大于或小于同一大小的其他字體。因此，當有一種字體不能用來顯示時，替代字體可能會歪曲所要表達的意思。 字體font-size-adjust屬性

font-size-adjust屬性允許我們重新調整替代字體的縱橫比，這樣它可以更符全顯示效果。使用屬性值none可忽略縱橫比。要不然就包含所需要的縱橫比（一個小于1的十進制），一般情況下是首選顯示字體的縱橫比。然后，能夠識別樣式的瀏覽器裝飾會以指定的縱橫比計算和顯示替代字體的大小： s=(n/a)*fs

其中“s”是顯示替代字體時新的計算機字體大小，其計算方法如下：font-size-adjust的值“n”除以替代字體的縱橫比“a”,乘以當前字體大小“fs”。

例如，讓我們想你一下，首選字體是縱橫比為0.45的Tinies New Roman。如果該字體目前不可用，瀏覽器會替換為縱橫比為0.54的Comic Sans MS 字體。這次替換幾乎保持了相同的字體顯示大小——假設為18-px大小，而font-size-adjust屬性被設置為0.45,兼容CSS2的瀏覽器將以替代的Comic Sans MS字體顯示或打印文本，其字體大小相對于18px小一些，為（0.45、0.54x 18px）=15px。 遺憾的是，我們無法展示流行瀏覽器的處理方式，因為它們不支持這個屬性。 font-style屬性

使用font-style屬性可使文本傾斜。默認樣式為normal,可以改變成italic或oblique。例如： h2{font-style:italic}

將以斜體顯示所有二級標題的文字。老版本的瀏覽器只支持italic作為font-sytle屬性的值，新的瀏覽器及以后的版本都會支持這兩個值，然而通常很難區分italic和oblique。 font-variant屬性

使用font-variant屬性可以選擇所需字體的某種變形。這個屬性的默認值是normal，表示字體的常規版本。也可以指定small-caps來選擇字體的一個版本，在這個版本中，小寫字母都會被替換為小的大寫字母。 font-weight屬性

font-weight屬性控制著書寫字母的粗細。這個屬性的默認值是normal。也可以指定bold來得到字體的粗體版本，或者使用bolder和lighter值來得到比父元素字體更粗或更細的版本。要指定細或粗的不同等級，可以將值設置為100（最細）到900（最粗）之間100的倍數。值400等于字體的normal版本，而700就與指定為bold的效果一樣。 font屬性

有時，我們在平時的網站制作中會發現自己同時為一個標簽的文本內容顯示指定了多了與字體相關的屬性。完整的字體規范使用起來可能有一些不便。例如：

p{font-family: Times,Garamond,serif; font-weight: bold; font-size: 12pt; line-height: 14pt}

為了減少這種麻煩，并避免出現難以辨認的情況，應該使用易于理解的font屬性，然后把所有屬性組成一個聲明的集合：

p{font:bolld 12pt/14pt Times, Garamond,serif}

字體屬性的分組和排序在font屬性中是很重要的。必須首先指定字體系列列表結束。在所有屬性中，字體大小和字體系列是必需的；其他的則可以省略。 下面是更多font屬性的示例：

em{font:italic 14pt Times} h1 {font:24pt/48pt sans-serif} code {font:12pt Courier,monospace}

第一個示例告訴能夠識別樣式的瀏覽器，要用14磅、斜體的Times樣式來強調<em>文本。第二條規則用最粗的24磅sans-serif字體來顯示<h1>文本，而且文本的行距也為24磅。最后，<code>標簽內的文本被設置為12磅的Courier字體，或是瀏覽器定義的等寬字體。

關于創建網站的字體樣式可以實現的效果，則留給讀者自己去想像了。也許最新一期的wired雜志在這方面會有所幫助，可以找到比較前衛的字全和其他與輸出有關的用法。