/    Sign up×
Community /Pin to ProfileBookmark

Can I have different colored links on my page?

Copy linkTweet thisAlerts:
Aug 02.2005

Am I able to have different colored links on my page? I use the CSS method of controlling how my links look but I can’t find a way to, for example, have the links in my title appear white with no underline while having the links in my paragraphs appear grey and underlined. Any way to code this?

Here is the current code for the css link color:

[CODE]a:link {text-decoration:none;
color:#FFFFFF;}[/CODE]

This is for the white links I want in the top of the page. Now how do I have different colored links? Thanks in advance.

to post a comment
CSS

5 Comments(s) ↴

Copy linkTweet thisAlerts:
@deep_dhyaniAug 02.2005 — Hi,

you can understand by this example.

<HTML>

<HEAD>

<TITLE></TITLE>

<STYLE>

a{color:red;text-decoration:none};

p a{color:gray};

div a{color:green};

</STYLE>

</HEAD>

<BODY BGCOLOR="#FFFFFF" TEXT="#000000" LINK="#0000FF" VLINK="#800080" ALINK="#FF0000">

</BODY>

<a href="" class=".link_01_style">LINK 01</a><br>

<p>

<a href="">LINK 02</a><br>

</p>

<div>

<a href="">LINK 03</a><br>

</div>

</HTML>


Best regards

Deep Dhyani
Copy linkTweet thisAlerts:
@JayhawkAug 02.2005 — You can use "style " at any time, which over-rides th class:
[CODE]
<a href='whatever' style='text-decoration:none; color:#FFFFFF'>whatever</a>
[/CODE]
Copy linkTweet thisAlerts:
@basketkase543authorAug 02.2005 — Ha! I didn't even think of that *slaps head*! Thanks people.
Copy linkTweet thisAlerts:
@basketkase543authorAug 02.2005 — Actually, i just thought of another problem with the style method. The things is that I want my link color in the body of my text to be black and then white when hovered over but in my header I want my links white but to turn black when hovered over. As far as I know there is no inline style command for that. Any ideas?
Copy linkTweet thisAlerts:
@basketkase543authorAug 03.2005 — Nevermind, I searched through the forums and saw that toicontien answered it perfectly:

We can't really help a whole lot unless you give us some more info (i.e. your HTML and CSS source). The easiest way is to create CSS classes:

<i>
</i>
/* General link colors */
a:link {
color: #[Hex color value];
}

a:visited {
color: #[Hex color value];
}

a:hover {
color: #[Hex color value];
}

a:focus {
color: #[Hex color value];
}

a:active {
color: #[Hex color value];
}


/* Menu link colors */
.menu:link {
color: #[Hex color value];
}

.menu:visited {
color: #[Hex color value];
}

.menu:hover {
color: #[Hex color value];
}

.menu:focus {
color: #[Hex color value];
}

.menu:active {
color: #[Hex color value];
}

Then to give the menu links the correct color:
<i>
</i>&lt;a href="#" class="menu"&gt;&lt;/a&gt;

[/QUOTE]

Thanks!
×

Success!

Help @basketkase543 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 5.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: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

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

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...