Links In CSS
| Previous | Home | Next |
Applying CSS to your links allows you to do all sorts of nice roll-over effects and advanced text highlighting. You will also be able to have many sets of links on a single page, all with different formatting. Links can be styled with any CSS property (e.g. color, font-family, background, etc.)
In addition, links can be styled differently depending on what state they are in.
- a:link - a normal, unvisited link
- a:visited - a link the user has visited
- a:hover - a link when the user mouses over it
- a:active - a link the moment it is clicked
Simple Example
<html>
<head>
<style>
/* unvisited link */
a:link {
color:#FF0000;
}
/* visited link */
a:visited {
color: #FF00FF;
}
/* mouse over link */
a:hover {
color: #0000FF;
}
/* selected link */
a:active {
color: #0000FF;
}
</style>
</head>
<body>
<h1><a href="C:/xampp/htdocs/r4r_advance/css1/fonts_in_css.shtml"
target="_blank" >Click on a link</a></h1>
<p><i>Note:</i> Basically it is provide different types of linking in CSS.</p>
</body>
</html>
Target Attribute Values
- _blank: Opens the linked document in a new window or tab
- _self: Opens the linked document in the same frame as it was clicked (this is default)
- _parent: Opens the linked document in the parent frame
- _top: Opens the linked document in the full body of the window
| Previous | Home | Next |