Two CSS tips.

These tips are meant to whet your appetite for using CSS. These tips are more in the form of a "Quick Start" than a tutorial. For full tutorials refer to the "Resources and further reading" section of this article.

1) No underlines in links

a:link {
 text-decoration: none;
}
a:visited {
 text-decoration: none;
}
a:hover {
 text-decoration: underline;
}
a:active {
 text-decoration: underline;
}

This will display the links on your page without an underline. When a user hovers over your link, the underline appears.

2) Navigation Buttons without using images

<html>
<head>
<title>Test Nav</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.topNav {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 10px;
  text-transform: uppercase;
}
.topNav a:link {
  border: 1px solid;
  padding-top: 3px;
  padding-right: 3px;
  padding-bottom: 5px;
  padding-left: 5px;
  background : White;
  text-decoration: none;
  margin-right: 4px;
}
.topNav a:hover{
  color : #FFFFFF;
  background : #9900CC;
}
.topNav a:active{
  color : Black;
  background : #CCCCCC;
}
.topNav a:visited{
  border: 1px solid;
  padding-top: 3px;
  padding-right: 3px;
  padding-bottom: 5px;
  padding-left: 5px;
  margin-bottom: 3px;
  text-decoration: none;
}
-->
</style>
</head>
<body>
<p class="topNav"><a href="link_one.html">link one</a> <a href="link_two.html">Link two</a></p>
</body>
</html>

This example creates a CSS class called topNav. It defines the formatting for links in the class. It is implemented by putting your navigation links in a paragraph and assigning that paragraph to the topNav class. You can see a version of this type of navigation buttons on my site www.christian-web-masters.co... . The main navigation buttons on my site use this technique. Using no images saves me a lot in bandwidth and causes the pages to load fast for my users.

Sean Buscay
www.christian-web-masters.comSean Buscay is on a mission to CREATE, ADVANCE, and EXPOUND faith in JESUS using web technology. He is the owner of Christian-Web-Masters.com .