Style Sheet Question

[jizbot]

Is there a way that i can create a style
in my "styles.css" that would set the colors of my links?

like if i had a few different types of links on the page (in the body, on the nav bar etc etc...)

id like to be able to create a style that would allow me to set the link and vlink... but also be able to set something like "Active link" to white, so that they could see what page their currently on. is there a way to do so?

Im new to style sheets and dont know much about them.

also i link to my style sheet in my head
and then have been using the div tag to assign the style to the text im wanting affected
ex. < div class="style" >...is there a better (more proper) tag to use?

[jizbot]

Perfect!
thank you very much

And i suppose that since you put body after the "a" that means i could then create several link types?

a.body
a.nav
a.title
etc etc etc...?

and the hover...is that like a mouseover?

[Karl]

Here we go:
<BLOCKQUOTE><font size="1" face="Verdana, Arial">code/font><HR><pre>
a.body {
stuff: value;
}

a.body:hover {
stuff: value;
}

a.body:visited {
stuff: value;
}

a.body:active {
stuff: value;
}
[/code]

called like &lt;a class="body" href=""&gt;link&lt;/body&gt;

------------------
Karl Austin
KDA Web Services
"Everyone has a photographic memory. Some just don't have film."

[Hierophant]

Correct on both questions.

------------------
Wayne Luke - Sitepoint Moderator/Internet Media Developer
Digital Magician Studios - Making Magic with Web Applications
wluke@digitalmagician.com

[jizbot]

Ok well i used that exact chunk of code above... And i filled in each a.body style with its own color

i made the a.body = bashe
a.body:hover = white
a.body:active = white
a.body:visited = dark gray

however... nothing seems to be happening

the links are bashe and work fine, however, they do not change color when the mouse rolls over them and they do not change color to dark gray once visited... nor do they go to white when active

any idea what i might have done wrong?

[Hierophant]

First put quotes (single or double) around the the options. This is only required by the options with more than 1 word but Netscape likes it better that way. Second, the hover pseudo-class only works in IE 4.0 and Netscape 6.0 and higher. As to why the others don't work, I don't know. Make sure your not use any FONT tags.

Repeat after me...
"Font tags are evil"

------------------
Wayne Luke - Sitepoint Moderator/Internet Media Developer
Digital Magician Studios - Making Magic with Web Applications
wluke@digitalmagician.com

[jizbot]

ok well your right... i looked at it thru my IE and the hover works great.

however the Active still wasnt working =(

so now that i know it wont work for Netscape, what is my next option?

dare i say javascript?

[Kevin Yank]

Believe it or not, this is a feature of CSS.

Consider the following style sheet:

<BLOCKQUOTE><font size="1" face="Verdana, Arial">code/font><HR><pre>&lt;STYLE TYPE="text/css"&gt;
&lt;!--

A:hover { color: yellow }
A:link { color: red }
A:visited { color: blue }
A:active { color: lime }

--&gt;
&lt;/STYLE&gt;[/code]

At first glance, you might guess that a visited link will be blue, and that it will turn yellow when the mouse hovers over it... but this isn't quite right. With the mouse over it, the link is both visited and hovered! Thus, both of the applicable rules come into play, and it's up to the browser to decide which one to apply. Fortunately, the CSS specification has something to say on the subject:

<BLOCKQUOTE><font size="1" face="Verdana, Arial">code/font><HR><pre>A:link { color: red } /* unvisited links */
A:visited { color: blue } /* visited links */
A:hover { color: yellow } /* user hovers */
A:active { color: lime } /* active links */[/code]

------------------
-Kevin Yank.
http://www.SitePoint.com/
Helping Small Business Grow Online!

[This message has been edited by kyank (edited June 19, 2000).]