This tutorial will show u how to make Image free, rollover box with text!
Example:
HERE
Code:
.main a {
background-color : #6385E7;
color : White;
font: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 11px;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
display: block;
border: 1px solid Black;
padding-top: 3px;
padding-bottom: 3px;
text-decoration: none;
padding-right: 3px;
padding-left: 3px;
width: 60px;
font-weight: bolder;
text-align: center;
}
.main a:hover {
letter-spacing: 4px;
background-color: #4B72E3;
color: Black;
display: block;
}
Copy the code into your style sheet, then in dreamweaver apply the style "main" to the text you wont to have this effect.
a and a:hover
a = a link
a:hover = the link when the mouse is over it.
More in a then a:hover
there is more information in .main a then .main a:hover because the extra information has been cared on to the hover link so you only need to change the things you wont to change.
Problem?
-Your text will not change in till it is a link.
-Preview it (it will look a bit diff rent in dreamweaver)
BY FUZZUK
[CSS] - [Rollovers] - [CLawes]
Started by
CLawes
, Oct 14 2004 10:30 AM
No replies to this topic
0 user(s) are reading this topic
0 members, 0 guests, 0 anonymous users