Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > Link style over riding another

Reply
Thread Tools

Link style over riding another

 
 
Ian Davies
Guest
Posts: n/a
 
      04-24-2006
Hello

I want to display more than one style of link on a webpage using CSS but an
finding it impossible to do. I wish the menu bar at the top to have
different style of link to those links in the main body.

I thought this would be easy as I have a header page in a separate html to
the body (to make it easy to display the header on each page). However the
link style in the body over rides the link style in the header. I was hoping
they would remain local to their respective pages.

How can I resolve this please

Ian


 
Reply With Quote
 
 
 
 
Neredbojias
Guest
Posts: n/a
 
      04-24-2006
To further the education of mankind, "Ian Davies"
<(E-Mail Removed)> vouchsafed:

> Hello
>
> I want to display more than one style of link on a webpage using CSS
> but an finding it impossible to do. I wish the menu bar at the top to
> have different style of link to those links in the main body.
>
> I thought this would be easy as I have a header page in a separate
> html to the body (to make it easy to display the header on each page).
> However the link style in the body over rides the link style in the
> header. I was hoping they would remain local to their respective
> pages.


Assign a class to the links you want different and style the class as
another link:

<a class="altlink" href="example.com">Example</a>

a:link,a:visited {
background:white;
color:black;
}
..altlink:link,.altlink:visited {
background:blue;
color:red;
}

--
Neredbojias
Infinity has its limits.
 
Reply With Quote
 
 
 
 
gil
Guest
Posts: n/a
 
      04-24-2006
The order of specifying the styles determines which ones will be used.
The last style specified for an element will be the one used.

BUT, You should be able to create styles for differently identified
div's allowing you to have different link styles, even on the same page.

on external style sheet (preferred), or internal (on every html page)

....
#header a {text-decoration: none}
#header a:link {color: green;}
....
....
#main a {text-decoration: underline;}
#main a:link {color: red;}
....
etc.


in your body
<div id="header"> header code with links </div>
<!--should use the styles in #header section of stylesheet-->

<div id="main"> main page code with links </div>
<!--should use the style in #main section of stylesheet-->

anything inside the div will use styles specified as id. Remember, you
can only use the same id attribute once per html document.

Gil

At approximately 2006/04/24 16:34, Ian Davies typed these characters:

> Hello
>
> I want to display more than one style of link on a webpage using CSS but an
> finding it impossible to do. I wish the menu bar at the top to have
> different style of link to those links in the main body.
>
> I thought this would be easy as I have a header page in a separate html to
> the body (to make it easy to display the header on each page). However the
> link style in the body over rides the link style in the header. I was hoping
> they would remain local to their respective pages.
>
> How can I resolve this please
>
> Ian
>
>

 
Reply With Quote
 
Toby Inkster
Guest
Posts: n/a
 
      04-24-2006
Ian Davies wrote:

> I want to display more than one style of link on a webpage using CSS but an
> finding it impossible to do. I wish the menu bar at the top to have
> different style of link to those links in the main body.


A:link { ... }
A:visited { ... }

DIV.menu A:link { ... }
DIV.menu A:visited { ... }

A.special:link { ... }
A.special:visited { ... }

--
Toby A Inkster BSc (Hons) ARCS
Contact Me ~ http://tobyinkster.co.uk/contact

 
Reply With Quote
 
Ian Davies
Guest
Posts: n/a
 
      04-25-2006
Thank you
That worked fine
Ian

"Neredbojias" <http://www.neredbojias.com/fliam.php?cat=alt.html> wrote in
message news:Xns97AF8DF1CFC5Ahttpwwwneredbojiasco@208.49.8 0.251...
> To further the education of mankind, "Ian Davies"
> <(E-Mail Removed)> vouchsafed:
>
> > Hello
> >
> > I want to display more than one style of link on a webpage using CSS
> > but an finding it impossible to do. I wish the menu bar at the top to
> > have different style of link to those links in the main body.
> >
> > I thought this would be easy as I have a header page in a separate
> > html to the body (to make it easy to display the header on each page).
> > However the link style in the body over rides the link style in the
> > header. I was hoping they would remain local to their respective
> > pages.

>
> Assign a class to the links you want different and style the class as
> another link:
>
> <a class="altlink" href="example.com">Example</a>
>
> a:link,a:visited {
> background:white;
> color:black;
> }
> .altlink:link,.altlink:visited {
> background:blue;
> color:red;
> }
>
> --
> Neredbojias
> Infinity has its limits.



 
Reply With Quote
 
Toby Inkster
Guest
Posts: n/a
 
      04-25-2006
gil wrote:

> The order of specifying the styles determines which ones will be used.
> The last style specified for an element will be the one used.


That's not entirely true. Specificity is also a key factor. For example:

<style type="text/css">
#green { color: green }
#green2 { color: green }
.red { color: red }
</style>

<p id="green" class="red">
I am green.
</p>

The ID selector is more specific than the class selector, so gets applied
to the paragraph.

More on specificity here:
http://www.w3.org/TR/CSS21/cascade.html#specificity

--
Toby A Inkster BSc (Hons) ARCS
Contact Me ~ http://tobyinkster.co.uk/contact

 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Over(joy)riding mk Python 7 02-17-2010 08:00 PM
Inheriting methods but over-riding docstrings Steven D'Aprano Python 16 01-22-2010 05:13 AM
Over-riding static functions/data John C++ 4 11-05-2009 12:25 PM
Over-riding an error Brian Salter-Duke C Programming 21 05-09-2009 07:55 PM
Re: Over-riding equals method dilemma Michael Borgwardt Java 23 08-23-2004 12:44 PM



Advertisments