
Link				With CSS, links can be styled in different ways, such as unterlined taxt, colored texh or a button.
			Links can be styled differently depending on what state they are in.	Links can be styled with any CSS property (e.g. color, font-family, background, etc.).
a	a: link	color:	/* unvisited link */
	a:visited		a:link {	In addition, links can be styled differently depending on what state they are in.
	a:hove		color: red;	The four links states are:
	a:active	border:	}	a:link - a normal, unvisited link
			/* visited link */	a:visited - a link the user has visited
			a:visited {	a:hover - a link when the user mouses over it
			color: green;	a:active - a link the moment it is clicked
			}
			/* mouse over link */	When setting the style for several link states, there are some order rules:
			a:hover {	a:hover MUST come after a:link and a:visited
			color: hotpink;	a:active MUST come after a:hover
			}
			/* selected link */
			a:active {
			color: blue;
			}

		text-decoration:	The text-decoration property is mostly used to remove underlines from links.
			a:link {
			text-decoration: none;
			}
			a:visited {
			text-decoration: none;
			}
			a:hover {
			text-decoration: underline;
			}
			a:active {
			text-decoration: underline;
			}

		background-color:	The background-color property can be used to specify a background color for links
			a:link {
			background-color: yellow;
			}
			a:visited {
			background-color: cyan;
			}
			a:hover {
			background-color: lightgreen;
			}
			a:active {
			background-color: hotpink;
			}

Link Button			<head>
			<style>
			a:link, a:visited {
			border: 2px solid grey;	the color of the button
			background-color: lightgrey;	the color of thetext on the button
			color: white;
			padding: 14px 25px;
			text-align: center;
			text-decoration: none;
			display: inline-block;
			}
			a:hover, a:active {
			background-color: lightblue;
			}
			</style>
			</head>
			<body>	Note: target="_blank" creates a new tab (page) to hold the content of the link rather than to overwrite the ols page.
			<a href="default.asp" target="_blank">This is a link</a>
			</body>

			Add different styles to hyperlinks:
			<head>
			<style>
			a.one:link {color:red;}
			a.one:visited {color:blue;}
			a.one:hover {color:brown;}

			a.two:link {color:red;}
			a.two:visited {color:blue;}
			a.two:hover {font-size:150%;}

			a.three:link {color:red;}
			a.three:visited {color:blue;}
			a.three:hover {background:lightgreen;}

			a.four:link {color:red;}
			a.four:visited {color:blue;}
			a.four:hover {font-family:monospace;}

			a.five:link {color:red;text-decoration:none;}
			a.five:visited {color:blue;text-decoration:none;}
			a.five:hover {text-decoration:underline;}
			</style>
			</head>
			<body>
			<p>Mouse over the links and watch them change layout:</p>
			<p><b><a class="one" href="default.asp" target="_blank">This link changes color</a></b></p>
			<p><b><a class="two" href="default.asp" target="_blank">This link changes font-size</a></b></p>
			<p><b><a class="three" href="default.asp" target="_blank">This link changes background-color</a></b></p>
			<p><b><a class="four" href="default.asp" target="_blank">This link changes font-family</a></b></p>
			<p><b><a class="five" href="default.asp" target="_blank">This link changes text-decoration</a></b></p>
			</body>