PUBLISHED: MARCH 06, 2014 – ARTICLE: HOW TO CHANGE LINK FONT

How to change link font is not that difficult, why not change your hyper-links to italic.

CSS Tutorials – How To Change Link Font

If you go to your CSS stylesheet and look for the CSS code for your links you will be able to change your link font in the code.

Look for this CSS code

a:link {
/* unvisited link */
text-decoration: underline;
font-weight: none;
color: #C00000;
}
a:visited {
/* visited link */
text-decoration: underline;
font-weight: none;
color: #C00000;
}
a:hover {
/* mouse over link */
text-decoration: underline;
font-weight: none;
color: #000000;
}

And add font-style:italic; and all your links will be italic

a:link {
/* unvisited link */
text-decoration: underline;
font-weight: none;
font-style:italic;
color: #C00000;
}
a:visited {
/* visited link */
text-decoration: underline;
font-weight: none;
font-style:italic;
color: #C00000;
}
a:hover {
/* mouse over link */
text-decoration: underline;
font-weight: none;
font-style:italic;
color: #000000;
}

By using the above CSS code with italic as the font style all links will be italic. You can also do it another way when you create your own website.

How To Change Link Font on certain links only

Lets say you want your links to be normal but would also like to be able to add italic links on the same page so you would have normal links and italic links.

This can be done by by creating a new CSS code that will only tell certain links to be italic, all you have to do is add the below CSS code to your CSS stylesheet:

.bb1{margin-right:1.0em;font-size:24px;font-weight: none }
bb1:link {
/* unvisited link */
text-decoration: underline;
font-weight: none;
font-style:italic;
color: #C00000;
}
bb1:visited {
/* visited link */
text-decoration: underline;
font-weight: none;
font-style:italic;
color: #C00000;
}
bb1:hover {
/* mouse over link */
text-decoration: underline;
font-weight: none;
font-style:italic;
color: #000000;
}

Next you will have to use this HTML link code

<a href="http://www.yourlinkhere.com/" title="Your title goes here." onclick="gbar.qs(this)" class="bb1">Anchor text goes here</a>

Now using the above link on your page you have control and as well as the font being italic you can also change the text colour and text size, with out effecting any other links on your page.

This is because the CSS code will only change links that are (class=”bb1″)

Now you know how to change link font from normal to italic.