Styling multiple html links with css.

Code....

You can style multiple html links differently on the same page simply by adding a class to the link & then some css. For example the two linsk below would be styled with the css that follows….

HTML

<a href=“something dot html” class=“newclass”>Link text</a>
<a href=“somethingv1 dot html” class=“anothernewclass”>More link text</a>

CSS

a.newclass:link {
color: #444444;
text-decoration: none;
}

a.newclass:visited {
color: #444444;
text-decoration: none;
}

a.newclass:hover {
color: #f2f2f2;
text-decoration: none;
    }

a.newclass:active {
color: #444444;
text-decoration: none;
}

a.anothernewclass:link {
color: #f2f2f2;
text-decoration: none;
}

a.anothernewclass:visited {
color: #f2f2f2;
text-decoration: none;
}

a.anothernewclass:hover {
color: #222222;
text-decoration: none;
}

a.anothernewclass:active {
color: #f2f2f2;
text-decoration: none;
}

Related posts