Styling links with CSS

by danielkwood

HTML

<html>
    <head>
        <title>Styling links</title>
        <link rel="stylesheet" href="theme.css" type="text/css"/>
    </head>
    <body>
        <h1>Home</h1>
        <a href="index.html">Home</a> <br>
        <a href="about.html">About Us</a> <br>
        <a href="products.html">Products</a> <br>
        <a href="contact.html">Contact Us</a> <br>
    </body>
</html>

CSS

body{
    font-family: Arial;
}
a:link{
    color: #008677;
    text-decoration:none;
}
a:visited{
    color: #439889;
}
a:hover{
    color: #003129;
    text-decoration: underline;
}
a:active{
    color: #004d40;
    font-weight: bold;
}