/    Sign up×
Community /Pin to ProfileBookmark

CSS Link Color

Copy linkTweet thisAlerts:
Apr 04.2020

Hey all, new here –
I’m trying to change the link color on my website theme, for which I have no access to the actual html or css. All I have the ability to do is inject some custom CSS to change styles.

I’ve added my code and for some reason everything is working except for the first a:link color – the links stay blue until they are hovered over. The a:visited, a:hover and a:active color changes are all working. Anyone know why that might be???

I’m using the following code:

<style>
a:link {
color: #545453;
background-color: transparent;
text-decoration: none;
}
a:visited {
color: #545453;
background-color: transparent;
text-decoration: none;
}
a:hover {
color: #E5BE1C;
background-color: transparent;
text-decoration: underline;
}
a:active {
color: #545453;
background-color: transparent;
text-decoration: underline;
}
</style>

to post a comment
CSSHTML

6 Comments(s) ↴

Copy linkTweet thisAlerts:
@cootheadApr 04.2020 — Hi there NobleS,

and a warm welcome to these forums. :)

This is that you require...

``<i>
</i>&lt;style media="screen"&gt;
a {
color: #545453;
text-decoration: none;
}

a:hover,
a:active {
color: #e5be1c;
text-decoration: underline;
}
&lt;/style&gt;<i>
</i>``

_coothead_
Copy linkTweet thisAlerts:
@NobleSauthorApr 05.2020 — Thank you so much for the reply! Unfortunately, it's still not working. The hover color works, but the standard link color does not. I can't understand why it partially works but partially doesn't...any other thoughts, by chance?
Copy linkTweet thisAlerts:
@cootheadApr 05.2020 — Hi there Nobles,

If you want the standard color to be displayed

until the link is clicked, then code it like this...

``<i>
</i>&lt;style media="screen"&gt;
a {
color: #545453;
text-decoration: none;
}

a:link {
color: #551a8b;;
}


a:hover,
a:active {
color: #e5be1c;
text-decoration: underline;
}
&lt;/style&gt;<i>
</i>``
**Note**

_"Link (unvisited): The default state that a link resides in,

when it isn't in any other state.

This can be specifically styled using the :link pseudo class."_

**Further reading:-**

[url=https://developer.mozilla.org/en-US/docs/Learn/CSS/Styling_text/Styling_links#Lets_look_at_some_links][color=#069]**MDN** - Styling Links[/color][/url]

_coothead_
Copy linkTweet thisAlerts:
@NobleSauthorApr 06.2020 — THANK YOU! I could not figure that out to save my life. I so appreciate it!
Copy linkTweet thisAlerts:
@siddhi_patelApr 06.2020 — Hello..

if you want to show standard color to display than code is like below
``<i>
</i>&lt;style&gt;
a{
color:black; //put your color
text-decoration:non;
}

a:link
{
color:grey; //put your color
}
a:hover
{
color:dark grey;
text-decoration:underline
}

a:active
{
color: red ; // put your color
}
&lt;/style&gt;<i>
</i>``


**a:link** => This is a normal, unvisited link.

**a:visited** => This is a link visited by user at least once

**a:hover** => This is a link when mouse hovers over it

**a:active** => This is a link which is just clicked.
Copy linkTweet thisAlerts:
@miaka14Apr 08.2020 — I like this [Website](https://expert-writers.net) becouse here I can find writer or editor that help me to write my essay in university. I have big promlems with this, dont like writing tasks
×

Success!

Help @NobleS 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.6,
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,
)...