a tag nomenclature in stylesheet...

[fdgsogc]

Can someone point me to a reference that discusses the various ways of using the a tag in a stylesheet.

I am referring to nomenclature like this:

a:hover{
color:white
}

Which changes the hover color of any a tag using the stylesheet to white.

I think I've seen a way to associate the a tag with other style names. So for instance, I'd like to create a style called "homepageformat" and then set the a tag formatting strictly within the homepageformat style.

Any ideas?

 

[Foamcow]

Quick summary,

you can assign styles to elements in 3 ways

[ul]
[li]By element[/li]
[li]By id[/li]
[li]By class[/li]
[/ul]

Setting by element is global. You define a style for a normal HTML tag and that style is applied to any of those elements in your document.
Example:

p { font-weight:bold; }

That would set contents of all your <p> tags to bold (unless overridden by another style.

Setting by ID is specific to a particular instance of an element identified by the ID.
Example:

#intro { font-weight:bold; }

This would set only the element assigned the ID of "intro" to have bold text. As in...

<p id="intro">This is my intro text</p>
<p>This is regular text</p>

IDs must be unique, they can only be used once per HTML document.

Setting style by class allows you to set a group of style rules and apply them at will to any element you wish.
Example:

.priceText { font-weight:bold; }

Which then you would like so...

<p>This item costs <span class="priceText">£34.99</span>, and is a bargain</p>

<p class="priceText">Only £34.99</p>

<ul>
<li class="priceText">£34.99</li>
</ul>

You can also use combinations of the above methods if you wish. In fact that is part of the power of CSS, it's cascading nature.

As for a more in depth explanation you might want to try

http://www.w3schools.com

they tend to have some good tutorials.

Foamcow Heavy Industries - Web design and ranting
Target Marketing Communications - Advertising, Direct Marketing and Public Relations
I wonder what possesses people to make those animated gifs. Do you just get up in the morning and think, "You know what web design r

 

[mkrausnick]

A great reference for all web technologies:

http://www.w3schools.com.

Lots of tutorials and demos, and great reference sections.

Mike Krausnick
Dublin, California

 

[mkrausnick]

sorry foamcow - I should have read to the end of your post first.

Mike Krausnick
Dublin, California

 

[BabyJeffy]

I recall reading this here a while back... a handy pneumonic for remembering the order you can assign the psuedoclasses:

L(link) O V(visited) E - H(hover) A(active) T E

Using the pneumonic above you can attach these psuedoclasses to the a tag in the following order:

a:link {color:red;}
a:visited {color:blue;}
a:hover {color:yellow;}
a:active {color:green;}

If you define them (on the same a tag) in a different order, then they will not work properly.

Also be aware that the :hover psuedoclass only works on the a tag (with IE anyway).

Lotsa fun things you can do with CSS... this has been one of them.

Jeff

 

[ChrisHunt]

W3 Schools is great for reference, but I'm not sure how good it is as a tutorial. For the latter, I recommend

http://www.htmldog.com/

.

-- Chris Hunt
Webmaster & Tragedian
Extra Connections Ltd

 

[Foamcow]

I just realised that I completely misread the initial question


Sorry for that.

Foamcow Heavy Industries - Web design and ranting
Target Marketing Communications - Advertising, Direct Marketing and Public Relations
I wonder what possesses people to make those animated gifs. Do you just get up in the morning and think, "You know what web design r

 

[tsdragon]

Jeff: that's a "mnemonic". Something that assists memory. A "pneumonic" would have something to do with the lungs, like pneumonia.


Tracy Dryden

Meddle not in the affairs of dragons,
For you are crunchy, and good with mustard.

 

[BabyJeffy]

*cough* *wheeze* what was that about the lungs again? I need a mnemonic to remember how to spell it in future too!

Cheers,
Jeff

 

[tsdragon]

Remember that "mnemonic" starts with "m" for "memory".

Tracy Dryden

Meddle not in the affairs of dragons,
For you are crunchy, and good with mustard.

 

[Foamcow]

.. and "pneumonic" starts with a "p" for patronising ;-P

hehe... Just kidding, couldn't resist

Foamcow Heavy Industries - Web design and ranting
Target Marketing Communications - Advertising, Direct Marketing and Public Relations
I wonder what possesses people to make those animated gifs. Do you just get up in the morning and think, "You know what web design r

 

[BabyJeffy]

Hehe... I was thinking more along the lines of:

P (for pneumonia)
P (for pulmonary)

Of course... I can't believe I forgot that it derives from the Greek pneumonikos... which is so much easier to remember *lol*

Have a fine weekend all (and sorry for hijacking your thread)!

Jeff

 

[tsdragon]

Sorry if I sounded patronizing, I really didn't mean to be. I was just trying to be helpful.


Tracy Dryden

Meddle not in the affairs of dragons,
For you are crunchy, and good with mustard.

 

[Foamcow]

hehe, I know

It was just such a good set up that I couldn't resist.

Hope I didn't cause offence.

Foamcow Heavy Industries - Web design and ranting
Target Marketing Communications - Advertising, Direct Marketing and Public Relations
I wonder what possesses people to make those animated gifs. Do you just get up in the morning and think, "You know what web design r