CSS styling links: why a:link, a:visited vs just a

i wonder why i can't use, or should not use

a { ..开发者_如何学C. }

vs

a:link, a:visited { ... }

---

If you only style a {...} then the style will be applied to all anchor elements including <a name="..."></a> elements, which define an anchor within the page, but do not reference a hyperlink.

a:link {...} specifically relates to hyperlinks. :visited, :hover and :active are different states of these links. Note that :hover and :active can apply to other elements as well.

---

You may provide the general style for your links with the a only. More specific styles can than be applied to the pseudo-classes. For example:

a {
    text-decoration: none;
    font-weight: bold;
}

a:link {
    color: #00F;
}

a:hover {
    color: #F00;
}

a:visited {
    color: #888;
}

a:active {
    color: #0F0;
}

In this example, all links are styled bold and are not underlined. But the color changes for each type of link...

---

It's just a matter of it you want to have different styling for a visited link vs normal links or not (for example dim out the link, I was already there).

Just a is valid, but do you want to give :visited or :hover links special styling for example?

---

:visited means you are trying to give a link a styling that has been visited by the user before and :hover means you are trying to give a link a style when a user mouse overs that link. You may or may not use it. This is your choice.

---

a:link if for an unvisited link, while a:visited is for a link that the user has visited. Usually the user will want some way to differentiate between the two in which case you'll style them separately. If you don't want any differences (e.g. a menu) then just a will do.

---

While the first a refers to all links, :link and :visited refers to specific states of those links.

The first one refer to non-visited links, and the latter to visited one. see http://www.w3.org/TR/CSS2/selector.html#link-pseudo-classes for more infos.

---

If you style a {...} it is work like a:link, a:visited {...}. Also a:link can't override a {...} style but a:visited can. If you want to add style all state of a it is better to use a {...}. Also a:link only apply a elements which have href attriubute.