a標(biāo)簽中的下劃線如何去掉？附源碼

猿友 2021-05-25 16:36:51 瀏覽數(shù) (11859)

反饋

在開發(fā)網(wǎng)頁中，a 標(biāo)簽設(shè)置的超鏈接在表現(xiàn)中會自帶一條下滑線，但是很多時候那條下劃線并不美觀。那么我們該如何去掉呢？這篇文章告訴你 a 標(biāo)簽中的下劃線如何去掉。

text-decoration 屬性

?text-decoration? 屬性是用來設(shè)置 a 標(biāo)簽的劃線屬性的。其屬性值有：

none：去掉下劃線
underline：設(shè)置下劃線
overline：在文本上方設(shè)置線條
line-through：在文本中間設(shè)置線條
initial：默認(rèn)值
inherit：從父元素中繼承

我們來看下具體代碼與實(shí)現(xiàn)效果：

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>a標(biāo)簽劃線 - 編程獅(w3cschool.cn)</title>
	<style type="text/css">
		#none{
			text-decoration: none;
		}
		#overline{
			text-decoration: overline;
		}
		#overline{
			text-decoration: line-through;
		}
	</style>
</head>
<body>
	<a href="">這是正常樣式</a><br>
	<a href="" id="none">無下劃線</a><br>
	<a href="" id="overline">上劃線</a><br>
	<a href="" id="line-through">中劃線</a><br>
	
</body>
</html>

實(shí)現(xiàn)效果：

a標(biāo)簽樣式

以上就是文章“a 標(biāo)簽中的下劃線如何去掉？附源碼”的全部內(nèi)容。更多前端知識學(xué)習(xí)請前往 w3cschool。

CSS

0 人點(diǎn)贊