將元素的 position 指定為 relative 後，會使得元素的寬高受到父元素寬高的影響。 例如 a 標籤被包在 li 標籤內時，如果 li 標籤寬度設定為 100px ， a 標籤的 Box 寬度 (等於 margin + border + padding + width) 就會等於 100px。這樣一來，連結的作用區域就不會只受限於文字或圖片上，而可以佔滿整個父元素。

1
2
3
4
5

a {
position: relative;
/* 如果連結是在 td 內的話，則要再加入底下這個設定 */
display: block;
}

如果兩種樣式是一樣的時候，不用寫兩次；利用逗號將兩者分開即可。 如果想要讓 link 和 visited 樣式一樣的話，也最好一起指定。

1
2
3
4
5
6
7
8
9
10

a:link, a:visited {
display: block;
font-size: 12px;
text-decoration: none;
color: #495F6E;
background: #F2F3F4;
font-family: "Arial";
padding: 3px;
margin: 0;
}

連結樣式指定的順序必須為 link -> visited -> hover -> active 。而 hover 和 active 會繼承 link 和 visited 的設定值，所以如果要變動的話，僅需更改想變動的屬性即可。

1
2
3
4
5

a:hover {
color: #FFFFFF; /* 變更文字顏色 */
background: #990000; /* 變更背景顏色 */
text-decoration: underline; /* 變更文字樣式 */
}