1,背景颜色
<!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=gb2312" />
<title>无标题文档</title>
<link href="hansh.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="hanshu">
<ul id="qqq">
<li>这是内容这是内容这是内容这是内容这是内容这是内容</li>
<li>这是内容这是内容这是内容这是内容这是内容这是内容</li>
<li>这是内容这是内容这是内容这是内容这是内容这是内容</li>
<li>这是内容这是内容这是内容这是内容这是内容这是内容</li>
<li>这是内容这是内容这是内容这是内容这是内容这是内容</li>
<li>这是内容这是内容这是内容这是内容这是内容这是内容</li>
<li>这是内容这是内容这是内容这是内容这是内容这是内容</li>
</ul>
</div>
<script language="javascript">
var a=document.getElementById("qqq").getElementsByTagName("li");
for(var i=0;i<a.length-1;i++){
a[i].onmouseover=function()
{
this.style.backgroundColor="#CCCCCC";
}
a[i].onmouseout=function(){
this.style.backgroundColor="white";
}
}
</script>
</body>
</html>
2,背景图片
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="116" height="56" align="center" onmousemove="this.style.backgroundImage='url(images/bg.jpg)'" onmouseout="this.style.backgroundImage=''"><a href="index.asp" class="top">首 页</a></td>
<td width="116" height="56" align="center" onmousemove="this.style.backgroundImage='url(images/bg.jpg)'" onmouseout="this.style.backgroundImage=''"><a href="main.asp" class="top">公司简介</a></td>
<td width="116" height="56" align="center" onmousemove="this.style.backgroundImage='url(images/bg.jpg)'" onmouseout="this.style.backgroundImage=''"><a href="product.asp" class="top">产品展示</a></td>
<td width="116" height="56" align="center" onmousemove="this.style.backgroundImage='url(images/bg.jpg)'" onmouseout="this.style.backgroundImage=''"><a href="gc.asp" class="top">企业设备</a></td>
<td width="116" height="56" align="center" onmousemove="this.style.backgroundImage='url(images/bg.jpg)'" onmouseout="this.style.backgroundImage=''"><a href="order.asp" class="top">客户反馈</a></td>
<td width="116" height="56" align="center" onmousemove="this.style.backgroundImage='url(images/bg.jpg)'" onmouseout="this.style.backgroundImage=''"><a href="contactus.asp" class="top">联系我们</a></td>
<td width="116" height="56" align="center" onmousemove="this.style.backgroundImage='url(images/bg.jpg)'" onmouseout="this.style.backgroundImage=''"><a href="admin/index.asp" target="_blank" class="top">后台管理</a></td>
<td width="106" height="56" align="center"><div align="center" style="font-family:Arial, Helvetica, sans-serif; font-size:12px">
<script language="JavaScript" type="text/javascript">
<!-- Begin
var enable=0; today=new Date();
var day; var date;
var time_start = new Date();
var clock_start = time_start.getTime();
if(today.getDay()==0) day="星期日"
if(today.getDay()==1) day="星期一"
if(today.getDay()==2) day="星期二"
if(today.getDay()==3) day="星期三"
if(today.getDay()==4) day="星期四"
if(today.getDay()==5) day="星期五"
if(today.getDay()==6) day="星期六"
date=+(today.getYear())+"年"
+(today.getMonth()+1)+"月"
+today.getDate()+"日 ";
document.write("<span style='font-size: 9pt;color:#000000'>"+date);
document.write(day+"</font></span>");
// -->
</script>
</div></td>
</tr>
</table>
注:style="background-position:center; background-repeat:no-repeat;"可对其进行修饰
<script language="javascript">
function displayhead(id)
{
for(var i = 1;i < 10;i++ )
{
document.getElementById("head_td_" + i).style.background = "url(images/menu_dd.gif)";
document.getElementById("head_tab_" + i).style.display = "none";
}
document.getElementById("head_td_" + id).style.background = "url(images/menu_d.gif)";
document.getElementById("head_td_" + id).style.backgroundPosition = "center";
document.getElementById("head_td_" + id).style.backgroundRepeat = "no-repeat";
document.getElementById("head_tab_" + id).style.display = "block";
}
</script>
<table width="980" height="33" border="0" align="center" cellpadding="0" cellspacing="0" background="images/menu_bg.gif">
<tr>
<td id="head_td_1" width="108" class="t1" style="text-align:center; background-position:center; background-repeat:no-repeat;" onmouseenter="displayhead('1')"><a href="/"><span class="t1">首 页</span></a></td>
<td id="head_td_2" width="101" class="t1" style="text-align:center; background-position:center; background-repeat:no-repeat;" onmouseenter="displayhead('2')"><a href="View.aspx?type=1"><span class="t1">关于邦派</span></a></td>
<td id="head_td_3" width="105" class="t1" style="text-align:center; background-position:center; background-repeat:no-repeat;" onmouseenter="displayhead('3')"><a href="News.aspx?type=1"><span class="t1">新闻中心</span></a></td>
<td id="head_td_4" width="123" class="t1" style="text-align:center; background-position:center; background-repeat:no-repeat;" onmouseenter="displayhead('4')"><a href="Article.aspx?type=1"><span class="t1">资讯一站通</span></a></td>
<td id="head_td_5" width="103" class="t1" style="text-align:center; background-position:center; background-repeat:no-repeat;" onmouseenter="displayhead('5')"><a href="Product.aspx"><span class="t1">产品专区</span></a></td>
<td id="head_td_6" width="106" class="t1" style="text-align:center; background-position:center; background-repeat:no-repeat;" onmouseenter="displayhead('6')"><a href="Image.aspx?type=1"><span class="t1">形象专区</span></a></td>
<td id="head_td_7" width="105" class="t1" style="text-align:center; background-position:center; background-repeat:no-repeat;" onmouseenter="displayhead('7')"><a href="SalesNet.aspx"><span class="t1">销售网络</span></a></td>
<td id="head_td_8" width="120" class="t1" style="text-align:center; background-position:center; background-repeat:no-repeat;" onmouseenter="displayhead('8')"><a href="Dealer.aspx"><span class="t1">经销商专区</span></a></td>
<td id="head_td_9" width="109" class="t1" style="text-align:center; background-position:center; background-repeat:no-repeat;" onmouseenter="displayhead('9')"><a href="View.aspx?type=8"><span class="t1">联系我们</span></a></td>
</tr>
</table>
3,flash实现