Hi here we send a code that hep you see them
bar.html<html>
<head>
<link href="style.css" rel="stylesheet" media="all" />
</head>
<body>
<div id="menu">
<ul>
<li><a href="#" class="current">home</a></li>
<li><a href="#">about us</a></li>
<li><a href="#">services</a></li>
<li><a href="#">solutions</a></li>
<li><a href="#">contact us</a></li>
</ul>
</div>
</body>
</html>
style.css*{
margin:0;
padding:0;
}
body{
background:#fff;
color:#666;
font:12px/18px Tahoma, Arial, Helvetica, sans-serif;
}
#menu{
margin:0 auto;
width:695px;
height:93px;
background:url(images/menu_022_bg.jpg) no-repeat;
}
#menu ul{
list-style:none;
width:495px;
margin:0 auto;
}
#menu li{
list-style:none;
display:block;
float:left;
height:93px;
line-height:93px;
margin:0 3px;
}
#menu li a{
display:block;
float:left;
color:#816232;
text-transform:uppercase;
font-size:11px;
font-weight:bold;
line-height:93px;
text-decoration:none;
padding:0 18px;
height:93px;
}
#menu li a:hover{
color:#6d532a;
background:url(images/menu_022_h.jpg) repeat-x;
}
#menu li a.current{
display:block;
float:left;
background:url(images/menu_022_h.jpg) repeat-x;
color:#6d532a;
text-transform:uppercase;
font-size:11px;
font-weight:bold;
line-height:93px;
text-decoration:none;
padding:0 18px;
height:93px;
}
#menu li a:hover.current{
color:#6d532a;
}
now here you replace the image name which you need, and still you have problem then just mentio here, I'll try to solve them.
January 03, 2007, 03:59:38 PM
