/    Sign up×
Community /Pin to ProfileBookmark

Several hyperlink styles on same page

Copy linkTweet thisAlerts:
Nov 02.2005

Hello everyone,

I have a:link and a:visited defined in my CSS1.

I need to employ different font style (color and size) for some of the hyperlinks on the same page that uses the basic hyperlink style.

I almost finished reading the entire W3C manual and still couldn’t figure it out.

Please help.

to post a comment
CSS

5 Comments(s) ↴

Copy linkTweet thisAlerts:
@LiLcRaZyFuZzYNov 02.2005 — you could apply different classes to the different links

e.g.

[code=html]
<a href="#" class="blue">blue</a>
[/code]

<i>
</i>/*CSS*/
a.blue{
//whatever
}
a.blue:hover{
//whatever on hover state
}
Copy linkTweet thisAlerts:
@shlomotauthorNov 02.2005 — Thanks for making my day... week... month.

I figured the hyperlink class but couldn't figure out the a.blue in the CSS.
Copy linkTweet thisAlerts:
@jogolNov 02.2005 — you need to apply different classes to the different links[/QUOTE]
not always...

if you have

[code=html]
<body>

<a href="#">Link</a>

<div id="div1">

<a href="#">Link</a>

<div id="div2">
<a href="#">Link</a>
</div><!--end div2-->

</div><!--end div1-->

</body>
[/code]

it works like this without having to use classes

[CODE]
a {
color: red;
}
#div1 a {
color: blue;
}
#div2 a {
color: green;
}
[/CODE]

this way when you have pages with similar layout but different content you don´t have to watch the classes in order to keep the look of the pages consistent.
Copy linkTweet thisAlerts:
@LiLcRaZyFuZzYNov 02.2005 — yes if you have a specific structure in which you can apply this, sure.

i'm more a "path" guy myself, more than putting classes everywhere.

But if you mainly have text on the page, and wish to have different hyperlinks for external linking or internal linking, then you would apply classes, because the links might appear on very different "levels", one might be just in a paragraph, whereas an other one might be encapsulated by a citation tag which would be in a div itself.

If you wish to have different looks for links that are exactly on the same level on a menu for example, then you'd also use classes.

but if you wish links to look differently in different levels of the menu, then you'd use jogol's method
Copy linkTweet thisAlerts:
@kiathauNov 16.2005 — Use different id or different css class willl works

<a href="" class="Hyperlink" id="Name">

#name

{

/* Styles Here */

}

Kiat Hau,

http://webidiot.blogspot.com, Let's build your web site
×

Success!

Help @shlomot spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 6.16,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...