明輝手游網(wǎng)中心：是一個免費提供流行視頻軟件教程、在線學(xué)習(xí)分享的學(xué)習(xí)平臺！

html超鏈接字體顏色如何改？超鏈接字體顏色的更改方法總結(jié)

發(fā)表時間：2023-09-03 來源：明輝站整理相關(guān)軟件相關(guān)文章人氣：

[摘要]本篇文章主要的講述了一個關(guān)于HTML超鏈接文本字體顏色的更改方法，說了一個是純a標(biāo)簽的文本更改，還有一種是把a(bǔ)標(biāo)簽放在div標(biāo)簽中進(jìn)行css樣式更改�，F(xiàn)在我們一起來看文章的內(nèi)容吧首先我們先從一個例子開始改超鏈接的字體顏色：我們要做的是未被點擊時超鏈接文字無下劃線，顯示為灰色；當(dāng)鼠標(biāo)在鏈接上時有下劃...
本篇文章主要的講述了一個關(guān)于HTML超鏈接文本字體顏色的更改方法，說了一個是純a標(biāo)簽的文本更改，還有一種是把a(bǔ)標(biāo)簽放在div標(biāo)簽中進(jìn)行css樣式更改�，F(xiàn)在我們一起來看文章的內(nèi)容吧

首先我們先從一個例子開始改超鏈接的字體顏色：

我們要做的是未被點擊時超鏈接文字無下劃線，顯示為灰色；當(dāng)鼠標(biāo)在鏈接上時有下劃線，鏈接文字顯示為紅色；當(dāng)點擊鏈接后，鏈接無下劃線，顯示為黃色。

我們來看完整的實驗代碼：

<html> 
<head> 
<title>PHP中文網(wǎng)：取消下劃線實例</title> 
<style> 
a:link{text-decoration: none;color: gray}
a:active{text-decoration:blink}
a:hover{text-decoration:underline;color: red}
a:visited{text-decoration: none;color: yellow}
</style> 
</head> 
<body> 
歡迎來到<a href="www.php.cn">php中文網(wǎng)</a>
</body> 
</html>

效果圖有三個：

tuyi.png

這個是未被點擊的樣子，無下劃線，顯示為灰色。

tuer.png

這個是鼠標(biāo)一上去的樣式，有下劃線，顯示為紅色。

tusan.png

這個是被點擊之后的樣式，無下劃線，顯示為黃色文本。

以上就是上代碼的實驗結(jié)果。算是把剛才的任務(wù)完成了，讓我們更容易理解上面的代碼。

現(xiàn)在我們來理解一下上述代碼的具體含義：

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

  • a:active 指正在點的鏈接；

  • a:hover 指鼠標(biāo)在鏈接上；

  • a:visited 指已經(jīng)訪問過的鏈接；

  • text-decoration是文字修飾效果的意思；

  • none參數(shù)表示超鏈接文字不顯示下劃線；

  • underline參數(shù)表示超鏈接的文字有下劃線

現(xiàn)在理解出來了，這是不是更好理解了上面的那些代碼，就是把這些一個個的往里面帶入進(jìn)去。

現(xiàn)在還有個實例，就是超鏈接在div標(biāo)簽中，我們要把div標(biāo)簽內(nèi)的超鏈接的文本變顏色，怎么變呢？

讓我們一起來看解釋代碼：

1.CSS代碼：

a{ color:#00F}
a:hover{ color:#F00}/* 鼠標(biāo)經(jīng)過懸停字體顏色 */
/* css 注釋說明：以上代碼為設(shè)置html中超鏈接統(tǒng)一字體顏色 */
.div a{ color:#090}
.div a:hover{ color:#090}
/* css注釋說明：以上代碼為設(shè)置html中.div對象內(nèi)超鏈接字體顏色

2.html代碼：

<p>測試內(nèi)容我是統(tǒng)一設(shè)置的顏色藍(lán)色<a href="http://www.php.cn">php中文網(wǎng)</a></p>
<div class="div">我在div對象內(nèi)，超鏈接顏色為<a href="#">我是超鏈接綠色</a></div>

這個代碼的效果如下圖：

tusi.png

上面的文本編程了藍(lán)色，下面的文本變成了綠色。效果很明顯。

這就是用css樣式來改變html中的超鏈接文本的方法了。有問題的可以在下方提問

【小編推薦】

html空格代碼怎么寫？html空格代碼的表現(xiàn)方式總結(jié)

html圖片怎么等比例縮放？html img圖片縮放方法總結(jié)(附實例)

以上就是html超鏈接字體顏色怎么改？超鏈接字體顏色的更改方法總結(jié)的詳細(xì)內(nèi)容，更多請關(guān)注php中文網(wǎng)其它相關(guān)文章！


網(wǎng)站建設(shè)是一個廣義的術(shù)語，涵蓋了許多不同的技能和學(xué)科中所使用的生產(chǎn)和維護(hù)的網(wǎng)站。