Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations gkittelson on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Using a seperate style for some links

Status
Not open for further replies.

hermantb

Programmer
Aug 30, 2002
18
US
I am new to CSS and have been playing with A:link style in the header which is working great except that one column of links I have needs to be different from ther rest of the links on the sheet. How can I override the style, or can I create a custom style in the header and apply it to the specific links below in the code?
 
try this
<style>

a.lnk1:active { color: blue; text-decoration: none; }
a.lnk1:hover { color: red; text-decoration: none; }
a.lnk1:link { color: teal; text-decoration: none; }



a.lnk2:active { color: green; text-decoration: none; }
a.lnk2:hover { color: yellow; text-decoration: none; }
a.lnk2:link { color: teal; text-decoration: none; }


</style>

<a href=&quot; &quot; class=&quot;lnk1&quot;>blah</a>
<a href=&quot; &quot; class=&quot;lnk2&quot;>blah</a>
admin@onpntwebdesigns.com
 
you can define another style like this:

A.newClass:active { what you want this style to do }
a.newClass:hover { what you want this style to do }

then to specify the style on the links you want use:

<a href=&quot;this.htm&quot; class=&quot;newClass&quot;>Something</a>

hope this helps !
 
Here's an example of what I did and it didn't work...Do you need more than version 5.5 of IE to support classes? All links are the default bright blue with 12 point Times new roman...


In Header:
A.lnk1:active {color:&quot;#000080&quot;; font:normal 10pt &quot;Arial&quot;}

A.lnk2:active {color:&quot;#000080&quot;; font:normal 10pt &quot;Arial&quot;; font-weight: bold}


In body:
<td width=&quot;20%&quot; align=&quot;center&quot;>
<a href=&quot;index.htm&quot; class=&quot;lnk1&quot;>Home</a>
</td>

<td width=&quot;34%&quot; align=&quot;left&quot; height=&quot;19&quot;>
<a href=&quot;News.htm&quot; class=&quot;lnk2&quot;>News</a>
</td>
 
hmm. the active style didn't work when I ran my code either but the others did.

I remembered this thread and the answer besides mine may be better for this seeing as this is happening. check it out
thread215-336515
admin@onpntwebdesigns.com
 
Here is what worked...

A:link {color:&quot;#000080&quot;; font:normal 10pt &quot;Arial&quot;}
A.lnk2:link {color:&quot;#000080&quot;; font:normal 10pt &quot;Arial&quot;; font-weight: bold}

<a href=&quot;University%20Sites.htm&quot; class=&quot;lnk2&quot;>University Sites</a>

This link was bold...all others were A:link style

Thanks for your help!
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top