網頁字型大小怎麼樣去設定

來源:文萃谷 1.94W

網頁字型的大小都是可以自己設定的,你知道嗎?下面是本站小編整理的網頁字型大小設定方法,希望對你有幫助。

網頁字型大小怎麼樣去設定

  網頁字型大小設定小編推薦方法一

近期,經常有電腦愛好者朋友由於不小心誤操作導致電腦瀏覽網頁時出現了字型變大或變小等,導致使用不習慣。於是網友們在各大it論壇和百度知道,soso問問等回答平臺裡,求助網頁字型大小設定的問題,但都不是很滿意。所以我今天就給大家詳細介紹幾種改變網頁字型設定大小的方法。

1.其實很多朋友出現網頁字型變大或變小都是錯誤的調整到了網頁的縮放比例導致的,正常網頁縮放比例是100%,在瀏覽網頁的最右下角可以看到縮放的比例,如果是比例設定不正常,那麼網頁字型肯定顯示不是正常大小了,如下圖:

2.我們也可以以IE8為例,點選頁面選單檢視→選擇縮放→根據適合的大小進行調整。如下圖:

如上圖所看到的就是正常情況下網頁所顯示的100%縮放網頁字型顯示大小,如果調節成70%字型就會變的小了不少,如下圖:

3.所以當您發現電腦瀏覽網頁出現字型變大或者變小,首先檢視下網頁縮放比例是否是100%正常數值,我們可以使用按住Ctrl鍵,然後滾動滑鼠,就可以把網頁上的文字大小隨意調整。也就是右下角的網頁放大百分比,即縮放。按住Ctrl鍵然後向下滾動滑鼠是縮小比例,字型會變小;按住Ctrl鍵然後向上滾動滑鼠是方法比例,字型會變大。

4.如果網頁縮放比例正常,網頁字型大小依然顯示不正常,我們還可以開啟網頁,在頂部找到“工具”選項,再選擇“Internet選項,如下圖:

在顯示面面的“常規”頁標中,點選“輔助功能”。在展開選單中選擇“不使用網頁中指定的字型大小”並點選“確定”。然後再對上一層選單也點選“確定”。這樣在InternetExplorer選單“檢視”選項中的“文字大小”處就可以改變文字的大小了,有興趣的朋友可以去設定一下。如下圖:

5.在InternetExplorer裡“檢視”——〉“文字大小”——〉“中”也可以設定網頁字型大校如下圖:

網頁字型大小設定的方法其實可以採用不少方法來實現,比如我們還可以通過調整解析度來改變字型顯示的大小等,設定的方法也都比較簡單,另外以上介紹的網頁字型大小設定方法是以windowsxp系統為例,windows7系統設定方法也類似,這裡就不介紹了。如有疑問,請到我們的留言板留言,我們會盡快的給您回覆。

  網頁字型大小設定小編推薦方法二

字型(Font)的.設定是網頁製作新手遇到的第一個難點。如何控制字型大小,如何取消超連結字型的下劃線是網友來信問得最多的。好,我們來徹底研究一下字型的各個方面:

○字符集的設定。

在檢視html檔案原始碼時,我們經常可以在檔案頭和之間看到這麼一句程式碼:

這段程式碼的作用是什麼呢?是否可以刪除呢?

其實這是meta標籤的設定語句,是給瀏覽器看的。它的作用就是告訴瀏覽器:這個HTML檔案是採用gb2312字符集製作的。當瀏覽器讀到這一程式碼,便以gb2312字符集來解釋和翻譯網頁原始碼,然後我們就可以看到正確的網頁。所以這個meta語句是非常重要的,儘量不要刪除。

gb2312就是我們最熟悉的GB簡體碼,英文是iso-8859-1字符集。其它還有BIG5,UTF-8,Shift-JIS,EUC,KOI8-2等字符集,分別用於不同的字型顯示。

○字型的使用。

在網頁裡,字型的定義語句是:顯示文字

其中Arial就是一種字型的名稱。

預設的瀏覽器定義的標準字型是中文宋體和英文timesnewRoma字型。也就是說,如果你沒有設定任何字型,網頁將以這兩種標準字型顯示。同時,著兩種字型也可以在任何作業系統和瀏覽器里正確顯示。windows另外自帶了40多種英文字型和5種中文字型。這些字型,你也可以在網頁裡自由使用和設定。凡是使用windows作業系統的瀏覽器都可以正確顯示這些字型,但在其它作業系統裡,如unix則不能完全正確顯示。

如果你需要用一種特殊的字型來體現你的風格,那麼如何讓大家可以真正看到你的設計頁面呢?解決的辦法是:用圖片。將需要用這種字型的地方用圖片代替,以保證所有人看到的頁面是同一效果。

○字型的樣式(style)。

字型的樣式有四種:正常體(regular),斜體(Italic),粗體(Bold),粗斜體(BoldItalic)。設定方法很簡單,阿捷就不多羅嗦了。

○字型的效果。

這裡指通過html語言設定可以直接顯示的效果,在html裡的語句設定為:

顯示文字

其中,overline是指上劃線效果。其它常用的效果還有:underline(下劃線),uppercase(大寫)等等。

  網頁字型大小的控制

字型大小的控制是本節的重點。

一般字型預設的大小是12pt(鎊).用語句可以將文字增大2pt。這種方法我們都已經掌握了。而現在網路上最流行的小中文字型大小為9pt,是如何設定的呢?有三種方法:

1.用"顯示文字"語句來設定。顯然這種方法非常麻煩,你必須為每段文字都設定大校

2.用CSS層疊樣式表。CSS是DHTML的一個組成部分,它可以定義整個頁面的字型顯示風格和大校是較為簡便的方法。比如,這裡需要設定整個頁面文字大小為9pt,只要將下面這段程式碼加入html程式碼的和之間:

<--body{FONT-SIZE:9pt}

th{FONT-SIZE:9pt}

td{FONT-SIZE:9pt}

-->

其中FONT-SIZE:9pt指字型的大小為9鎊

3.第二種方法已經簡化了許多步驟,但是仍然不是最理想的方法,因為你必須在每個頁面的head區都放置這麼一段程式碼,擴大了檔案的位元組。另外這樣的做法還有一個重大缺點,就是如果我需要修改整個站點的字型大小,就必須一頁一頁的改!

所以推薦給你最終也是目前最好的方法---外部摸板檔案呼叫法。

"外部摸板呼叫"就是說你將css的設定作成一個單獨的檔案,在每個頁面裡都呼叫它。一旦你需要修改字型大小,只要修改一個檔案,幾百個頁面就同時修改了。(這種方法類似子程式呼叫編寫過程式的網友很容易理解:)

呼叫的具體方法如下:

(1)將上面的css程式碼copy成一個檔案,然後修改後綴名為

(2)在html檔案的之間插入,語句呼叫(注意有關路徑的設定正確)OK!

○字型超連結樣式的設定。

通常在網頁的中設定連線的顏色,如:

其中:link--Hyperlink(連線)的顏色

vlink--visitedHyperlink(已訪問過的連線)顏色

alink--activeHyperlink(當前活動的連線)顏色

顏色用rgb的16進位制碼錶示如紅色是#FF0000。

同樣用CSS可以更簡便的設定網頁超連線的樣式,看下面這段程式碼

A:link{TEXT-DECORATION:none;COLOR:#0000FF}

A:visited{TEXT-DECORATION:none;COLOR:#000000}

A:active{TEXT-DECORATION:none;COLOR:#FF0000}

A:hover{COLOR:#FF0000}

將它插入html檔案的head區就可以了。其中link設定的是有超連結的顏色;visited是訪問過的超連結顏色;active是滑鼠移上去的顏色;hover是滑鼠點選時的顏色。而"text-decoration:none"是指取消超連結的下劃線顯示。

關於CSS的設定還有更多的用法和技巧,比如在同一頁中設定不同的字型大小和超連結顏色,請學習有關CSS的專門知識在這裡我們不在冗述。

●上面已經介紹了字型在技術上的各個方面。有關字型的設計使用,目前還沒有一個成熟的理論,下面是幾條網頁設計中字型的使用原則,僅供參考:

1.不要使用超過3種以上的字型。字型太多則顯得雜亂,沒有主題

2.不要用太大的字。因為版面是寶貴,有限的,粗陋的大字型不能帶給訪問者更多資訊。

3.不要使用不停閃爍的文字。想讓瀏覽者多停留一會兒的話,就不要使用閃爍的文字。

4.原則上標題的字型較正文大,顏色也應有所區別。


熱門標籤