|
|
Home | Audio | DIY | Guitar | iPods | Music | Brain/Problem Solving | Links| Site Map
This work is licensed under a Creative Commons License.
CSS Text Rollovers
CSS Styles are a simple and fast way of making your site look good. In this tutorial you will learn how to make cool text rollovers.
The trick is to use the a:hover style! If you work with Dreamweaver the steps to follow are given below:
1. In your style sheet choose New
2. Next choose Use CSS selector
3. In the drop down menu choose a:hover
4. Finally, Define your style. You can choose your font, color, bold, underline etc.
5. You're done it! 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
<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>
Select the link style for the link. An example of the code is given below
<a href="link.htm" target="_parent" class="links">Entheos</a>
Home | Audio | DIY | Guitar | iPods | Music | Links | Site Map | Contact
