|
|
|
|
|
Change the color on mouse rollover using CSS
Why using an image if you can use CSS style in a way the button color changes when you run a pointer over it.
|
|
 |
|
|
|
|
|
|
|
|
|
|
 |
1.
|
|
|
Crate a new HTML page.
You can of course use the existing one, but a bit of improvistaion will be needed, which we are glad to give you on our forum.
|
|
| |
2.
|
|
|
Let's begin in a simple way.
Click the Table icon to crate a table.
|
|
| |
3.
|
|
|
Choose and enter same things as I did and click OK.
|
|
| |
4.
|
|
|
Two cell table has been created, enter some text in each of them (see picture).
Click Code, enable the Code view.
|
|
| |
5.
|
|
|
Position yourself under the tag <head>.
|
|
| |
6.
|
|
|
Enter the following two CSS styles:
<style type="text/css">
.menu {background-color: #a3c7dc; }
.menu:hover {background-color: #81acca; }
</style>
|
|
| |
7.
|
|
|
Now got to where your first table cell is located (see picture).
|
|
| |
8.
|
|
|
In the td tag add class="menu" (see picture).
|
|
| |
9.
|
|
|
Do the same thing for another cell/button (see picture).
|
|
| |
10.
|
|
|
Save your document and see what it does.
Press F12 while in Dreamweaver to launch the page you just did in your default web browser.
|
|
|
 |
|
|
|
