如何用CSS控制超鏈接字體樣式？

先一個例子，比如說下面這段代碼：

創(chuàng)新互聯(lián)公司專注為客戶提供全方位的互聯(lián)網(wǎng)綜合服務，包含不限于成都網(wǎng)站制作、做網(wǎng)站、外貿營銷網(wǎng)站建設、海珠網(wǎng)絡推廣、微信小程序開發(fā)、海珠網(wǎng)絡營銷、海珠企業(yè)策劃、海珠品牌公關、搜索引擎seo、人物專訪、企業(yè)宣傳片、企業(yè)代運營等，從售前售中售后，我們都將竭誠為您服務，您的肯定，是我們最大的嘉獎；創(chuàng)新互聯(lián)公司為所有大學生創(chuàng)業(yè)者提供海珠建站搭建服務，24小時服務熱線：028-86922220，官方網(wǎng)址：m.rwnh.cn

style type="text/css"

a:link {text-decoration:none;color:blue;}

a:hover {text-decoration:underline;color:red;}

a:active {text-decoration:none;color:yellow;}

a:visited {text-decoration:none;color:green;}/style其效果是：未被點擊時超鏈接文字無下劃線，顯示為藍色；當鼠標放在鏈接上時有下劃線，鏈接文字顯示為紅色；當點擊鏈接時，即鏈接被激活，鏈接無下劃線，顯示為黃色；當點擊鏈接后，也就是鏈接已被訪問過后，鏈接無下劃線，顯示為綠色。其中：

a:link 指正常的未被訪問過的鏈接；

a:hover 指鼠標在鏈接上；

a:active 指正在點的鏈接；

a:visited 指已經(jīng)訪問過的鏈接。參數(shù)設置：

text-decoration是文字修飾效果的意思；none參數(shù)表示超鏈接文字不顯示下劃線；underline參數(shù)表示超鏈接的文字有下劃線；如果是overline則給超鏈接文字加上劃線；換成line-through則是給超鏈接文字加上刪除線；blink則使文字在閃爍。

color:blue，color:red等是給鏈接文字加顏色。

還可以添加其他參數(shù)，如：

font-weight:bold給鏈接文字加粗；font-size:16pt設置鏈接文字字體大??；background:#ffd306給鏈接文字加背景顏色；font-style:italic鏈接文字傾斜；border-bottom:1px dashed #51bfe0給鏈接文字加虛線，其中1px是虛線的粗細度，數(shù)值越大越粗，dashed表示虛線，#51bfe0是虛線顏色，如果要給鏈接文字加虛線的話，就不用加下劃線了。

例如下面這兩段代碼：

style type="text/css"

a:hover {text-decoration:none;border-bottom:1px dashed red;}/style

其效果是當鼠標放在鏈接上的時候鏈接出現(xiàn)紅色虛下劃線。

style type="text/css"

a:hover {text-decoration:underline;font-weight:bold;color:red;background:blue;font-style:italic;}/style

其效果就是當鼠標放在鏈接上的時候，鏈接有下劃線，字體加粗，鏈接文字為紅色，背景為藍色，文字傾斜。

如果要去掉所有鏈接的下劃線則可以用下面這段代碼：

CSS如何設置超鏈接?

由于超鏈接有四種不同的狀態(tài)，CSS用偽類來標識它們。

(1) :link：設置a對象在未被訪問前的樣式表屬性。

(2) :visited：設置a對象在其鏈接地址已被訪問過時的樣式表屬性。

(3) :hover：設置對象在其鼠標懸停時的樣式表屬性。

(4) :active：設置對象在被用戶激活（在鼠標點擊與釋放之間發(fā)生的事件）時的樣式表屬性。

定義超鏈接的樣式：

定義超鏈接樣式的一般格式是：

選擇符:偽類名 { 樣式表 }

css中關于超鏈接的四個屬性正確順序為：

a:link {}

a:visited {}

a:hover {}

a:active {}

偽類名字對大小寫不敏感，但在定義順序上有要求。:hover必須被置于:link和:visited之后才是有效的，:active必須被置于:hover之后才是有效的。

如果沒有指定偽類，則默認為 :link。

超鏈接默認情況下是始總有下滑線的，如果要去掉下劃線，則需要添加樣式 text-decoration: none;

例子：

a:link { color:#dd3409;text-decoration:none; font-size:13px; }/**//* 超鏈接的樣式 */

a:visited { color:#9f301d;text-decoration:none; }

a:visited:hover { color:#9f301d;text-decoration:underline; }

a:hover { color:#dd3409;text-decoration:underline; }

a:active { color:#ff3300;text-decoration:underline; }

利用css設置四種不同樣式超鏈接的方法

html超鏈接樣式包括：正在連接、訪問過、鼠標盤旋，各個文本字體樣式設置如下

style type="text/css"

!-- 超鏈接文本字體設置--

A {

FONT-SIZE: 16px; FONT-FAMILY: 宋體

}

!-- 超鏈接正在連接的文本字體設置--

A:link {

COLOR: #0055bb; TEXT-DECORATION: none

}

!-- 超鏈接訪問過的文本字體設置--

A:visited {

COLOR: #0077bb; TEXT-DECORATION: none

}

!-- 超鏈接鼠標盤旋的文本字體設置--

A:hover {

COLOR: #ff0000; TEXT-DECORATION: none

}

/style

新聞標題：css設置超鏈接的樣式,如何設置超鏈接的css屬性的排列順序
分享URL：http://m.rwnh.cn/article42/dsdhiec.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供手機網(wǎng)站建設、建站公司、App設計、用戶體驗、虛擬主機、網(wǎng)站改版

廣告

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