如何修改HTML超鏈接樣式？

猿友 2021-03-12 14:58:07 瀏覽數 (8245)

反饋

在網頁開發(fā)中，我們不免會用到超鏈接，將內容鏈接到原網頁上。如果不對超鏈接進行設置，鏈接默認以固定樣式顯示，過于單一。那么我們要如何修改 HTML 中的超鏈接呢？這篇文章 W3Cschool 小編為大家介紹一下。

我們都知道，超鏈接是用<a></a>標簽來顯示的。如果我們需要修改樣式，則需要通過 CSS 修改它的樣式。<a></a>標簽的樣式還分為四個類型，分別為未訪問、已訪問、鼠標滑過、點擊。

a:link：未被訪問的鏈接
a:visited：已經訪問過的鏈接
a:hover：鼠標滑過鏈接
a:active：鏈接被點擊

需要注意的是：a:hover 必須在 ?a:link ?和 ?a:visited? 之后，a:active 必須在 ?a:hover? 之后，需要嚴格按順序才能看到效果。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>w3cschool - 編程獅，隨時隨地學編程</title> 
<style>
    a:link {text-decoration: none; color:blue;}/*未訪問的鏈接顯示為藍色，text-decoration:none將下劃線隱藏*/
    a:visited {color:black;} /*用戶已訪問過的鏈接顯示黑色*/
    a:hover {color:pink;}   /*鼠標放置在鏈接上時顯示為粉色*/
    a:active {color:yellow;}  /* 鏈接被點擊那一刻顯示黃色 */
</style>
</head>
<body>
    <p><b><a href="/css/" target="_blank">這是一個鏈接</a></b></p>
</body>
</html>

以上就是 W3Cschool 小編為大家介紹的如何修改 HTML 超鏈接樣式的全部內容。更多 HTML 相關內容請學習 HTML 教程。

HTML 前端

1 人點贊

如何修改HTML超鏈接樣式？

如何修改HTML超鏈接樣式？