CSS定义超链接样式的顺序及四个伪类的用法示例

下面是定义链接样式的基本方法：

`a:link`：定义正常链接的样式。

`a:visited`：定义用户已访问过的链接样式。

`a:hover`：定义鼠标悬浮在链接上时的样式。

`a:active`：定义链接被点击时的样式。

例如，以下代码定义了链接的四种状态的颜色和文本装饰：

```css

a:link { color:FF0000; text-decoration:underline; }

a:visited { color:00FF00; text-decoration:none; }

a:hover { color:000000; text-decoration:none; }

a:active { color:FFFFFF; text-decoration:none; }

```

在实际应用中，如果正常链接和已访问的链接样式相同，或者鼠标悬浮和点击时的样式相同，我们可以将它们合并定义。例如：

```css

a:link, a:visited { color:FF0000; text-decoration:underline; }

a:hover, a:active { color:000000; text-decoration:none; }

```

在CSS中定义链接样式时，需要遵循一定的规则，即LoVe HAte原则（即Link-Visited-Hover-Active的顺序）。如果顺序出错，可能会导致样式无法正确应用。

有时我们需要对页面中的某些特定链接进行特殊样式定义。这可以通过在伪类前面添加特定的ID或class来实现。例如：

```css

sidebar a:link, sidebar a:visited { color:FF0000; text-decoration:none; }

sidebar a:hover, sidebar a:active { color:000000; text-decoration:underline; background:FFFFFF; }

```

在HTML中调用时，只需将特定的ID或class应用到相应的元素上即可。例如：

```html