CSS Text Rollovers
Try these text rollover effects using CSS style
sheets. You can cut and paste the code provided.
CSS Styles are a simple and fast way of making your site look
good. In this you can learn how to make text rollovers.
The trick is to use the a:hover style! You can follow the
steps given below:
- In your style sheet choose New
- Choose Use CSS selector
- In the drop down menu choose a:hover
- Define your style. Choose the font, color, bold, underline
etc.
- You're thru! It's easy and fast and really cool!
Text Rollover Effect throughout the site
Copy this code between the head tags
<style type="text/css">
<!-- a:hover { font-family: Arial, Helvetica, sans-serif; font-size: 10pt; color: #990000}
-->
</style>
Text Rollover Effect in a particular place of your site
Step 1: Paste this code between the head tags
<style type="text/css">
<!--
.links { font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #003399}
.links:hover {font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #FF8B22;
text-decoration: none}
-->
</style>
Step 2: Select the link style for the link. An example of the code is given below:
<a href="link.htm" target="_parent"
class="links">yahoo</a>
|