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 Chris Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Link colour 3

Status
Not open for further replies.

Sam577

Technical User
Sep 2, 2003
168
GB
Hi,

I am currently learning CSS (and Dreamweaver CS3) and trying to get my head around it.

I want to create white links on the top nav bar against a blue background (in addition to the standard blue links) -- do I create a descendent tag of the <a> tag to do this? Any example snippets of code to point me in the right direction would be greatly appreciated.

Many thanks,
Sam
 
Sam577 said:
do I create a descendent tag of the <a> tag to do this?
This makes no sense at all. You could distinguish the links by giving them a class but better yet, you would name your navigation (usually with an id, provided you are not reusing it elsewhere on the page) and then use the descendant selector to apply css to your links. Such as:
Code:
#navigation a {
  color: white;
  background: blue;
}
I recommend you start learning about css here:
___________________________________________________________
[small]Do something about world cancer today: PACT[/small]
 
If you want all links in your nav bar to be white-on-blue, then you can use something like this, assuming your nav bar has an ID of "nav":

Code:
#nav a {
   background-color: #0000CC;
   color: #FFFFFF;
}

If you have multiple styles of links in your nav, then give the white ones a class, e.g.:

Code:
<a href="whatever.html">Normal link</a>
<a href="something.html" class="white">A white link</a>

and then use something like:

Code:
#nav a.white {
   background-color: #0000CC;
   color: #FFFFFF;
}

Hope this helps,
Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch
[/tt]
 
Hi,

You can create a class for that section. Maybe something like:

Code:
div.navbar a:link {color: #FFFFFF}
div.navbar a:visited {color: #ECECEC}
div.navbar a:hover {color: #FFD900}

Then, be sure to apply the class to the div or table or whatever you're using for your navigation bar.

Code:
<div class="navbar"> . . . </div>
 
I rule you all.

___________________________________________________________
[small]Do something about world cancer today: PACT[/small]
 

Thank you all.
I have just started reading a very good book (by the looks of it) called CSS, The Missing Manual, by David McFarland, but I need to do this today, so help is much appreciated.
 
Thank you all for your help, but I am not sure where to put this code. Should I create a CSS, do I select the nav bar and put in before the code for the nav bar?
Please check out and you can see what the problem is, the left nav buttons need to be white and the text in html at the top header needs to be in black as well as any links in the white content area.
I have no idea where to put this code from your helpful comments.
Thank you again so much
 
There are 3 places you can put CSS styling code for a webpage.

Either in a CSS style sheet, separate from your webpage (recommended method), in a style block in the header section for your page, or in the style property of the object you wish to style.

Where is the rest of your CSS?

I would create a style sheet, and link it to the webpage.



----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top