复制代码代码如下 :
<span style = "font-size : 14px;"> <! 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">
<헤드>
<meta http-equiv = "content-type"content = "texthtml; charset = utf-8">
<title> 메뉴 </title>
<스타일 유형 = "텍스트/CSS">
#Nav
{
목록 스타일 : 없음;
텍스트 정렬 : 센터;
}
#Nav Li
{
플로트 : 왼쪽;
너비 : 100px;
색상 : 흰색;
배경색 : #3E3E3E;
}
#메뉴
{
목록 스타일 : 없음;
패딩 : 5px;
디스플레이 : 없음;
마진 왼쪽 : -5px;
마진 -탑 : -5px;
}
#menu li
{
배경색 : #CCC;
너비 : 100px;
텍스트 정렬 : 왼쪽;
왼쪽 패딩 : 10px;
}
#menu li a : 링크
{
텍스트 결정 : 없음;
디스플레이 : 블록;
}
#menu li a : 호버
{
배경색 :#3E3E3E;
색상 : 흰색
}
</스타일>
</head>
<body>
<ul id = "nav">
<li> 据 数 库
<ul id = "메뉴">
<li> <a href = "http://blog.csdn.net/u011043843"> mysql </a> </li>
<li> <a href = "http://blog.csdn.net/u011043843"> sql server </a> </li>
<li> <a href = "http://blog.csdn.net/u011043843"> Oracle </a> </li>
<li> <a href = "http://blog.csdn.net/u011043843"> db2 </a> </li>
</ul>
</li>
<li> 前台脚本
<ul id = "메뉴">
<li> <a href = "http://blog.csdn.net/u011043843"> javaScript </a> </li>
<li> <a href = "http://blog.csdn.net/u011043843"> Ruby </a> </li>
<li> <a href = "http://blog.csdn.net/u011043843"> html </a> </li>
<li> <a href = "http://blog.csdn.net/u011043843"> python </a> </li>
</ul>
</li>
<li> 后台脚本
<ul id = "메뉴">
<li> <a href = "http://blog.csdn.net/u011043843"> php </a> </li>
<li> <a href = "http://blog.csdn.net/u011043843"> asp </a> </li>
<li> <a href = "http://blog.csdn.net/u011043843"> asp.net </a> </li>
<li> <a href = "http://blog.csdn.net/u011043843"> jsp </a> </li>
</ul>
</li>
</ul>
<script type = "text/javaScript">
var lis = document.getElementById ( "nav"). getElementsByTagName ( 'li');
var i = 0;
for (i = 0; i <lis.length; i ++)
{
if (lis [i] .classname == "child")
{
lis [i] .onmouseover = function ()
{
var ulobj1 = this.getElementsByTagName ( 'ul') [0];
ulobj1.style.display = "block";
this.style.backgroundcolor = "#ccc";
this.style.color = "black";
}
}
lis [i] .onmouseout = function ()
{
var ulobj1 = this.getElementsByTagName ( 'ul') [0]; //이 t htmlelement 对象
ulobj1.style.display = "none";
this.style.backgroundcolor = "#3e3e3e";
this.style.color = "화이트";
}
}
</스크립트>
</body>
</html> </span>