站長(zhǎng)資訊網(wǎng)寫(xiě)html超鏈接的時(shí)候，超鏈接總是自帶下劃線(xiàn)，如果不需要下劃線(xiàn)，我們需要將其去掉，下面我們就來(lái)說(shuō)一下怎么去掉下劃線(xiàn)。
我們?cè)谑褂贸溄拥臅r(shí)候，下劃線(xiàn)總是伴隨著出現(xiàn)，從視覺(jué)上來(lái)說(shuō)有著下劃線(xiàn)的a標(biāo)簽總是感覺(jué)很奇怪，而且在某些需求中，也不需要下劃線(xiàn)的出現(xiàn)，所以就會(huì)問(wèn)了，有沒(méi)有什么方法讓下劃線(xiàn)不出現(xiàn)呢？答案是：有的。
我們首先來(lái)看一下有下劃線(xiàn)的a標(biāo)簽。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>如何去掉html a標(biāo)簽下劃線(xiàn)</title> </head> <body> <div> <a href="">這是沒(méi)有去掉下劃線(xiàn)的a標(biāo)簽</a> </div> </body> </html>
這是沒(méi)有去掉下劃線(xiàn)的，是大家最熟悉的a標(biāo)簽。接下來(lái)讓我們看看去掉下劃線(xiàn)的a標(biāo)簽。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>如何去掉html a標(biāo)簽下劃線(xiàn)</title> <style> a{ text-decoration:none; } </style> </head> <body> <div> <a href="">這是去掉下劃線(xiàn)的a標(biāo)簽</a> </div> </body> </html>
從圖上可以看出，加上一行text-decoration:none;代碼之后，超鏈接就沒(méi)有下劃線(xiàn)了。
因?yàn)?code>text-decoration規(guī)定給文本添加上劃線(xiàn)，下劃線(xiàn)或者刪除線(xiàn)，當(dāng)屬性值為none時(shí)，表示文本沒(méi)有裝飾，所以加上這行代碼之后，a標(biāo)簽就沒(méi)有文本裝飾了。
是不是特別的簡(jiǎn)單，如果想給指定超鏈接去掉下劃線(xiàn)，只需要在a標(biāo)簽里使用行內(nèi)樣式就可以了。
推薦學(xué)習(xí)：CSS3視頻教程
