好不容易搞一堆代码出来，为什么没有效果显示？
<!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>无标题文档</title>
</head>
<style type="text/css">
#div1 {
height:160px;
width:280px;
}
#piclist .col {
width:300px;
height:200px;
position:relative;
overflow:hidden;
float:left;
margin:10px 0px 0px 0px;
}
#piclist .col a{
display:block;
width:280px;
height:180px;
top:160px;
background: none repeat scroll;
color:white;
font-style:normal;
line-height:25px;
padding:10px;
}
#piclist .col img .col a{
position:absolute;
top:0px;
left:0px;
}
</style>
<body>
<div id="piclist" class="piclist">
<div id="pic1" class="col">
<img src="images/pic1.jpg" width="281" height="173" /></img>
<a href="#" style="top:160px;">
学会html5 绝对的屌丝逆袭
<br></br>
本课程有浅入深、逐步推进，以示例为主线，详细完整地介绍HTML5的新功能与新特征
</a>
</div>
<div id="pic2" class="col">
<img src="images/pic2.jpg" width="271" height="175" />
<a href="#" style="top:160px;">
圆角水晶按钮制作
<br></br>
网页中的圆角按钮和宽度自适应按钮就这么轻松1制作！
</a>
</div>
<div id="pic3" class="col">
<img src="images/pic3.jpg" width="280" height="180" />
<a href="#" style="top:160px;"> 导航条菜单的制作 <br />
30分钟教你轻松制作出各种形式的网站导航条菜单 </a> </div>
<p> </p>
</div>
<script>
var div1=document.getElementById('pic1');
var div2=document.getElementById('pic2');
var div3=document.getElementById('pic3');
div1.onmouseover = function(){
div1.getElemementsByTagName('a')[0].style.top = 0;
}
div1.onmouseout = function(){
div1.getElemementsByTagName('a')[0].style.top = 160+'px';
}
div2.onmouseover = function(){
div2.getElemementsByTagName('a')[0].style.top = 0;
}
div2.onmouseout = function(){
div2.getElemementsByTagName('a')[0].style.top = 160+'px';
}
div3.onmouseover = function(){
div3.getElemementsByTagName('a')[0].style.top = 0;
}
div3.onmouseout = function(){
div3.getElemementsByTagName('a')[0].style.top = 160+'px';
}
</script>
</body>
</html>
