|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title> XHTML 1.0 Shell - Strict Specification </title>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
<style type='text/css'>
ul {
margin: 0;
padding: 0;
width: 100px;
list-style: none;
position: relative;
}
li {
padding-right: 5px
}
ul li a {
display: block;
text-decoration: none;
}
ul li a:hover {
background-color: #ddd;
}
span {
visibility: hidden;
position: absolute;
width: 5px;
height: 120px;
right: 0;
top: 0
}
span.a {
background: red;
}
span.b {
background: green;
}
span.c {
background: blue;
}
span.d {
background: yellow;
}
span.e {
background: pink;
}
span.f {
background: orange;
}
ul li a:hover span {
visibility: visible
}
</style>
</head>
<body>
<ul>
<li><a href='#'>A<span class="a"></span></a></li>
<li><a href='#'>B<span class="b"></span></a></li>
<li><a href='#'>C<span class="c"></span></a></li>
<li><a href='#'>D<span class="d"></span></a></li>
<li><a href='#'>E<span class="e"></span></a></li>
<li><a href='#'>F<span class="f"></span></a></li>
</ul>
</body>
</html>
|