如何編輯代碼讓網(wǎng)站的字體變得美觀

2015-02-15 分類：網(wǎng)站建設

一般的網(wǎng)站字體用的是默認的宋體，可是千篇一律的宋體讓人覺得毫無新鮮感，過于單調(diào)，讓人厭煩。如果你想要點美觀一點的字體怎么辦呢？很簡單，學一下簡單的代碼編輯。

一般字體默認的字體設置標簽格式：＜p＞網(wǎng)站設計＜/p＞

一般字體默認為宋體，如果你不喜歡宋體字作為你的網(wǎng)站字體。可以設置為你所希望的字體。但是你要確保網(wǎng)站字體在別人的電腦也可以顯示，不然在別人電腦上沒有字體庫，就會顯示為宋體了。

設置字體的標簽如下：

＜p＞網(wǎng)站設計＜/p＞

標簽具有下面三個屬性值：

size="..." 設置字體的大小，一般從1到7，它的默認值是+3，每次改變字體都是+3或者-3。

color="..." 字體顏色的設置。定義顏色可以利用RGB的16進制值，比如： color=“#ffffff” 。也可以直接利用顏色英文來定義，比如： color=“white”。

face="..." 字體樣式的設置，比如：face=“黑體”?；蛘?face=“黑體，宋體”。后者的格式，每當瀏覽器訪問第一種字體失敗后，瀏覽器就會訪問第二種字體，依此類推。

HTML還提供了以下字體樣式標簽：

1.六個標題樣式

從h1到h6，如：＜h1＞網(wǎng)站設計＜/h1＞

2.定義文本

定義大字體

＜big＞網(wǎng)站設計＜/big＞

3.字體風格

斜體字：＜em＞網(wǎng)站設計＜/em＞

粗體字：＜strong＞網(wǎng)站設計＜/strong＞

斜體+粗體字：＜strong＞＜em＞網(wǎng)站設計＜/em＞＜/strong＞

定義小字體

＜small＞網(wǎng)站設計＜/small＞或者＜small＞＜small＞＜small＞網(wǎng)站設計＜/small＞＜/small＞＜/small＞

如果你在字體標簽中設置了size="...",那么＜big＞標簽將不起作用。

除了以上常用字體標簽元素外，HTML還包含很多其它標簽，但不我們不多用。

二.CSS(層疊樣式表)改變字體

在過去頁面上的字體是一成不變的，靜靜的呆在那。當DHTML(動態(tài)網(wǎng)頁)出現(xiàn)后，我們能有更多方式控制字體了。一般來說，動態(tài)字體的實現(xiàn)核心是CSS(層疊樣式表)加JavaScript。使用了以上兩項技術后，字體就能產(chǎn)生許多變化。

1.CSS定義字體的標簽元素

-family: 設置字體字族。

對于以上的字體設置，我們可以采用一個方便的方法：

網(wǎng)站設計

在style定義的次序是：-style,-weight,-size,-family.

2.定義CSS字體屬性類

一般我們在制作動態(tài)字體時，我們會首先利用CSS定義出頁面字體的整個屬性，然后在頁面中引用，而不用對每段文本進行設置，這也是實現(xiàn)動態(tài)字體首先一步。

＜HTML＞

＜head＞

＜style type="text/CSS"＞

.tt2 { -family:"黑體"; -size: 16px; -style: normal; line-height: 17px }

＜/head＞

＜body＞

＜p＞網(wǎng)站設計＜/p＞

＜/body＞

＜/HTML＞

3.CSS定義字體和定義字體的沖突

對于CSS定義字體和定義字體，我們都要注意以下問題，比如有以下字體設置：

網(wǎng)站設計

這時侯字體大小將以-size: 200pt的定義來設置。但如果你在中加入size屬性，比如：

＜ size="5"＞網(wǎng)站設計

這時侯，字體的大小以size的設置為準，如果字體的大小是200pt將不起作用。其它的屬性也是一樣。如果你無需動態(tài)字體，就利用HTML4.0的來定義字體，需要動態(tài)字體時，就需要使用CSS和JavaScritp來定義字體及引發(fā)事件。

這里的“網(wǎng)站設計”兩個字引用了.main_2類定義的字體樣式。你可以定義不同的內(nèi)容來引用。

＜HTML＞

＜head＞

＜style type="text/CSS"＞

.tt1 { -family:"宋體"; -size: 15px; -style: normal; }

.tt2 { -family:"黑體"; -size: 16px; -style: normal; }

＜/head＞

＜body＞

＜p＞網(wǎng)站設計＜/p＞

＜/body＞

＜/HTML＞

只要你學會了用這些代碼編輯，那么就可以為你的網(wǎng)站設置具有美觀的文字了。

網(wǎng)站名稱：如何編輯代碼讓網(wǎng)站的字體變得美觀
鏈接分享：http://www.jbt999.com/news/33602.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站建設、網(wǎng)站導航、網(wǎng)站維護、網(wǎng)站營銷、定制開發(fā)、定制網(wǎng)站

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉載內(nèi)容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：[email protected]。內(nèi)容未經(jīng)允許不得轉載，或轉載時需注明來源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容

21個常用的網(wǎng)絡營銷專業(yè)術語 2016-03-04
網(wǎng)站建立鏈接的最佳方法是什么 2016-02-06
做好網(wǎng)站內(nèi)容的維護，遵守自然之道 2016-04-23
網(wǎng)站建設優(yōu)化如何利用好網(wǎng)絡平臺 2016-03-03
成都網(wǎng)站建設說說外鏈的建設 2016-02-05
說說谷歌優(yōu)化排名的一些技術 2016-03-03