不明白我的為啥運(yùn)行不出來
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
*{margin:0;padding:0;font-size:14px;}
.nav{
width:900px;
margin:0 auto;
}
ul{
height:30px;
list-style:none;
width:100%;
text-align:center;
margin-top:30px;
margin-left:100px;
border-bottom:4px solid yellow;
?}
?/*菜單<li>浮動(dòng)后，<li>脫離文檔流，導(dǎo)致<ul>將失去高度和寬度；如果需要對(duì)<ul>進(jìn)行整體背景設(shè)置，首先要給<ul>定義寬、高。*/
?li{?
? float:left;
? ?
?}
?a {?
display:block;
width:120px;
? height:30px;
? color:black;
? font-size:16px;
? text-decoration:none;
? text-align:center;
? line-height:30px;
? background-color:gray;
?
?}
?.on ,a:hover{
? display:block;
? color:red;
? background-color:yellow;
?
?}
?
?
</style>
<script type="text/javascript">
window.onload=function (){
var aA=document.getElementByTagName('a');
for(var i=0;i<aA.length;i++){
aA[i].onmouseover=function (){
clearInterval(This.time);
var This=this; /*把當(dāng)前的this對(duì)象傳進(jìn)來*/
This.time=setInterval(function (){
This.style.width=This.offsetWidth+8+"px"; /*8是變寬的速度*/
if(This.offsetWidth>=160){
clearInterval(This.time);
}
},30);
}
aA[i].onmouseout=function (){
clearInterval(This.time);
var This=this;
This.time=setInterval(function (){
This.style.width=This.offsetWidth-8+"px";
if(This.offsetWidth<=120){
This.style.width="120px";
clearInterval(This.time);
}
},30);
}
}
}
}
</script>
</head>
<body>
<div class="nav">
<ul>
<li><a class="on" href="">首 ?頁</a></li>
<li><a href="">新聞快訊</a></li>
<li><a href="">產(chǎn)品展示</a></li>
<li><a href="">售后服務(wù)</a></li>
<li><a href="">聯(lián)系我們</a></li>
</ul>
</div>
</body>
</html>
2017-03-21
CSS出錯(cuò)了