網頁作為一種信息的載體，文字還是很重要的一部分的，這里就總結一下他的幾種設置方法

一、font標簽

　　font使用來設置文字的標準屬性，但是由于一系列的原因已經不建議使用font標簽來指定屬性了，還是用css比較好，但是本文還是會介紹一下這種方法。font中可以設置很多種類的屬性，比如(括號里面是效果)：

　　1、顏色：設置紅色<font color="red">你好</font> （你好）

　　2、設置大?。涸O置字號為2和8<font size=2>字號2</font><font size=8>字號8</font> （字號2字號8）

　 3、字體類型：face屬性，可以用來指定字體，可選值有很多，這個屬性只支持你機器上存在的字體 （宋體楷體）

二、css設置

　　css設置字體樣式遠比用font標簽更加強大，涉及的面更廣。粗略總結如下：

　　1、總的屬性font，這個屬性中可以設置下面的多個屬性的值，調用方式（都可以缺?。?/p>

　　　　{font:font-style font-variant font-weight font-size font-family}

　　2、字體類型font-family：可以設置多種字體，用逗號分隔，瀏覽器會在你的電腦上注意尋找看是否能用，能用則選用該字體顯示后面的字體無　　　　效，最后實在是一個都沒有匹配上的話就采用默認字體。

　　　　示例：{font-family:黑體,隸書;}

　　3、字體大小font-size：設置文本的大小，有很多可能的取值，分為這么幾類：

　　　　i)xx-small、x-small、small、medium、large、x-large、xx-large這幾種字符串的方式，大小方式如下

　　　　　　　　xx-small x-small small medium large x-large xx-large

　　　　ii）smaller、larger：定義成比父元素更大或者更小的尺寸

　　　　iii）length：定義為一個固定值

　　　　iiii）百分比：定義為父元素的百分比大小

　　　　iiiii）inherit：從父元素繼承字體大小

　　4、字體風格font-style：主要是設置文本傾斜的。屬性有normal、italic、oblique三種（還可以取繼承），演示如下：

　　　　　　normal italic oblique

　　5、字體顏色color：這個就不用多說了，定義字體顏色值

　　6、字體顏色陰影text-shadow：定義字體陰影的顏色，可以是文字看上去更高端。使用方法如下：

　　　　<font>紅色陰影</font> 紅色陰影

　　7、字體粗細：字體加粗不光是可以用b標簽的，font-weight也可以很好地，并且更自由的改變字體粗細。取值可以是數字或者是normal、bold、　　　　　bolder、lighter，都是些見名知義的屬性

　　8、字體行高line-height：設置字的行高，也是數字和百分比都可以設置

　　9、字間距letter-spacing：字母之間的距離，默認值為0，可以用正負值調整

　　10、單詞間距word-spacing：跟上面差不多，這個是調整單詞的間距

　　11、字體變形font-variant：也就是可以將你的小寫字母用較小的大寫字母來代替，值有normal和small-caps（繼承不算，下同）。樣例如下：

　　 normal small-caps I'm REAL BIG

　　12、字母大小寫轉換text-transform：

　　13、font-size-adjust：這個比較復雜。首先要了解aspect值，字體的小寫字母 "x" 的高度與 "font-size" 高度之間的比率被稱為一個字體的 　　　　　　aspect 值。當字體擁有高的 aspect 值時，那么當此字體被設置為很小的尺寸時會更易閱讀。設置方法就是傳入一個數值。

　　14、font-stretch：可以對文本進行拉伸，類似文本大小也有以下幾種方式：

　　　　　ii）narrower、wider：定義成比父元素更大或者更小的尺寸

　　　　iii）ultra-condensed、extra-condensed、condensed、semi-condensed、semi-expanded、expanded、extra-expanded、ultra-expanded，從　　　　　　寬到窄排列。

　　　　iiii）inherit：從父元素繼承字體大小

三、css3中的改進

　　1、首先css3實現了調用服務器端的字體（我們上面的字體使用的前提都是客戶機上存在那種字體），這樣我們就可以自由的調用自己享用的字體，　　　　不用每次都顧慮客戶機是否存在該字體。首先給個例子吧：

 1 <style> 
 2 @font-face
 3 {
 4 font-family: myFirstFont;
 5 src: url('Sansation_Light.ttf'),
 6      url('Sansation_Light.eot'); /* IE9+ */
 7 }
 8 </style>
 9 div
10 {
11 font-family:myFirstFont;
12 }

　　　　正如上面的代碼所顯示的要調用服務器端的字體你要用的就是@font-face,然后你就要開始給出這個字體的定義，首先是原來的font-family換　　成是定義你自己的名字，然后給出它的文件的url地址。這樣在下面你就可以調用該字體了。

　　　　并且對于自體你不僅能夠直接使用還可以選擇一些“修飾”。暫時支持的屬性有：font-stretch、font-style、font-weight、unicode-　　　　　range（這個是用來定義字體支持的 UNICODE 字符范圍。默認是 "U+0-10FFFF"）

　　當然以上的這些都是比較通用的屬性，其他還是有不少的個別屬性的。另外好的字體其實都是能夠組合利用各種字體所營造出來的遠非一種屬性所能達到，具體就要看個人的藝術細胞了。另外個人感覺最近其實還是有一種繪制文本的方式，就是利用canvas的畫圖api，這樣理論上是可以得到任意形態的字體的，而且支持性也很好只是工作量很大，是不是采用就得看著辦了。

如果你覺得內容對你有幫助，請點個贊

本作品采用知識共享署名-非商業性使用-相同方式共享 2.5 中國大陸許可協議進行許可。

總結

以上是生活随笔為你收集整理的怎样设置网页中的文字样式的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。