Example : onmouseover each character changes the background
effect.
<!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html
xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta
http-equiv="Content-Type" content="text/html;
charset=utf-8" />
<title> Background
effect </title>
</head>
<body
style="width:800px; margin:0 auto">
<center>
<h3> Onmouseover each
character change the background effect
</h3>
<div
style="font-size:20px">
<a href=""
onmouseover ="document.bgcolor='maroon'">m</a>
<a href=""
onmouseover ="document.bgcolor='orange'">o</a>
<a href=""
onmouseover ="document.bgcolor='violate'">v</a>
<a href=""
onmouseover ="document.bgcolor='green'">e</a>
<a href=""
onmouseover ="document.bgcolor='cyan'">c</a>
<a href=""
onmouseover ="document.bgcolor='gray'">u</a>
<a href=""
onmouseover ="document.bgcolor='red'">r</a>
<a href=""
onmouseover ="document.bgcolor='silver'">s</a>
<a href=""
onmouseover ="document.bgcolor='ocean'">o</a>
<a href=""
onmouseover ="document.bgcolor='purple'">r</a>
<a href=""
onmouseover ="document.bgcolor='aqua'">a</a>
<a href=""
onmouseover ="document.bgcolor='silver'">c</a>
<a href=""
onmouseover ="document.bgcolor='lightslategray'">c</a>
<a href=""
onmouseover ="document.bgcolor='azure'">o</a>
<a href=""
onmouseover ="document.bgcolor='lightgreen'">r</a>
<a href=""
onmouseover ="document.bgcolor='lightblue'">d</a>
<a href=""
onmouseover ="document.bgcolor='white'">i</a>
<a href=""
onmouseover ="document.bgcolor='magenta'">n</a>
<a href=""
onmouseover ="document.bgcolor='gold'">g</a>
<a href=""
onmouseover ="document.bgcolor='brown'">t</a>
<a href=""
onmouseover ="document.bgcolor='skyblue'">h</a>
<a href=""
onmouseover ="document.bgcolor='black'">e</a>
<a href=""
onmouseover ="document.bgcolor='pink'">e</a>
<a href=""
onmouseover ="document.bgcolor='olive green'">a</a>
<a href=""
onmouseover ="document.bgcolor='dark teal'">c</a>
<a href=""
onmouseover ="document.bgcolor='tan'">h</a>
<a href=""
onmouseover ="document.bgcolor='dark yellow'">a</a>
<a href=""
onmouseover ="document.bgcolor='white'">r</a>
<a href=""
onmouseover ="document.bgcolor='bright green'">a</a>
<a href=""
onmouseover ="document.bgcolor='azure'">c</a>
<a href=""
onmouseover ="document.bgcolor='lightgreen'">t</a>
<a href=""
onmouseover ="document.bgcolor='lightblue'">e</a>
<a href=""
onmouseover ="document.bgcolor='white'">r</a>
<a href=""
onmouseover ="document.bgcolor='silver'">g</a>
<a href="" onmouseover
="document.bgcolor=' lime'">e</a>
<a href=""
onmouseover ="document.bgcolor=' deeppink'">t</a>
<a href=""
onmouseover ="document.bgcolor=' salmon’
">r</a>
<a href=""
onmouseover ="document.bgcolor= ‘tan’">e</a>
<a href=""
onmouseover ="document.bgcolor= ‘wheat’">s</a>
<a href=""
onmouseover ="document.bgcolor= ‘tomato’">u</a>
<a href=""
onmouseover ="document.bgcolor=’ springgreen’">l</a>
<a href=""
onmouseover ="document.bgcolor= ‘turquoise’">t</a>
</div>
</center>
</body>
</html>
