CSS - 偽類 :link 屬性

CSS 偽類選擇器:link匹配或表示尚未訪問的元素，即所有具有<a>和<area>元素，帶有href屬性，甚至帶有空href屬性。

偽類:link和:visited指定的樣式會被任何後續的互動式偽類（如:hover或:active）覆蓋。
為了正確設定連結樣式，需要將:link規則放在所有其他連結相關規則之前。
需要遵循LVHA規則，即:link, :visited, :hover和:active。
偽類:visited和:link是互斥的。

要選擇一個元素，而不管它是否已被訪問，請使用偽類:any-link。

:link {
   /* ... */ 
}

CSS :link 示例

這是一個:link偽類的示例。在這裡，我們看到在錨元素上使用:link偽類，背景顏色為淺黃色，尚未訪問。

<html>
<head>
<style>
   a {
      font-size: 1em;
      padding: 5px;
      display: inline-block;
      margin-right: 10px;
   }

   a:link {
      background-color: lightyellow;
   }
</style>
</head>
<body>
   <h2>:link selector example</h2>
   <strong><a href="#">Tutorialspoint</a></strong>
   <strong><a href="#">Google</a></strong>
</body>
</html>

這是一個:link偽類以及:hover偽類的示例。將滑鼠懸停在錨元素上並觀察更改後的背景顏色。

<html>
<head>
<style>
   a {
      font-size: 1em;
      padding: 5px;
      display: inline-block;
      margin-right: 10px;
   }

   a:link {
      background-color: lightyellow;
   }

   a:hover {
      background-color: lightsalmon;
      color: green;
   }
</style>
</head>
<body>
   <h2>:link selector example</h2>
   <strong><a href="#">Tutorialspoint</a></strong>
   <strong><a href="#">Google</a></strong>
</body>
</html>

列印頁面