[EMAIL PROTECTED] wrote:
> Hello,
>
> Can someone please explain how to tell when the following should be used:
>
> a:link or a.link
> a:hover or a.hover
> a:visited or a.visited
> a:active or a.active
>
> I seem to be getting them wrong, either the order or the selectors seem
> incorrect, and I'm wasting time with trial and error.
The first important distinction is between a selector and a
pseudo-selector. When you write a:<something> you are using what is
called a pseudo-selector, which applies to elements of that type only in
specific circumstances (for instance, when a link is being hovered). The
second type you are using (e.g. a.link) is actually an element class
selector, which matches elements of the type A which also have a class
of link.
So,
a:link { color:red; }
...will make all your links red, whereas
a.link { color:red; }
...will only make links which have a class of 'link', red (e.g. <a
href="foo.html" class="link">foo</a>).
The different states of the pseudo-selectors refer to the different
states a link can be in (or more accurately, the states an anchor
element can be in). These are (in turn): anchors that are link somewhere
(so it ignores all cases where you might have bad markup such as <a
name="foo"></a>), when the element is being hovered by the mouse, when
the element has been visited (i.e. the user has already visited that
link before loading the page) and when the element is active (in most
cases this means when the link has been clicked, but this can be invoked
via the keyboard as well in some browsers).
Hope this helps!
~B
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/