サマリー：<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>導(dǎo)航欄下拉菜單</title> <script> var current=n
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>導(dǎo)航欄下拉菜單</title>
<script>
var current=new Date();//獲取當(dāng)前本地時間
// document.write(current);//輸出當(dāng)前本地時間
document.write(current.getFullYear()+'年')//獲取年份
//document.write(current.getMonth()+'月')//獲取月份
//國外0代表1月
var month = new Array(12)
month[0]='一月'
month[1]='二月'
month[2]='三月'
month[3]='四月'
month[4]='五月'
month[5]='六月'
month[6]='七月'
month[7]='八月'
month[8]='九月'
month[9]='十月'
month[10]='十一月'
month[11]='十二月'
document.write(month[current.getMonth()])//輸出當(dāng)前月份
document.write('星期'+current.getDay()+'<br>')//輸出星期
document.write('時間: '+current.getHours()+':')//輸出小時
document.write(current.getMinutes())//輸出分鐘
//document.write(current.getSecond());//輸出秒數(shù)
</script>
<style>
/*導(dǎo)航條*/
div{width: 100%;
background: #2F3E45;
height: 52px;
margin-top: 60px;
}
/*unorder 樣式去除*/
ul{
list-style: none;
}
/*一級li標(biāo)簽左浮動*/
.nav>li{
float: left;
}
/*ul a標(biāo)簽相關(guān)屬性*/
ul a{
display: block;/*塊級元素*/
text-decoration: none;
width: 100px;
height: 50px;
text-align: center;
line-height: 50px;
color: white;
background-color: #2f3e45;
border: 1px solid blue;
}
/*導(dǎo)航欄第一級菜單第一個li標(biāo)簽邊框第1、第4角設(shè)置為10px圓角*/
.nav>li:first-child a{
border-radius: 10px 0 0 10px;
}
/*導(dǎo)航欄第一級菜單最后一個li標(biāo)簽邊框第2、第3角設(shè)置為10px圓角*/
.nav>li:last-child a{
border-radius: 0 10px 10px 0;
}
/*產(chǎn)品分類之子菜單*/
.drop-sub{
padding: 0;
display: none;
}
.drop-sub01{
padding: 0;
display: none;
}
/*浮動子菜單背景色及字體顏色*/
.drop-sub li:hover a{
background-color:purple;
}
.drop-sub01 li:hover a{
background-color:red;
}
/*產(chǎn)品分類hover顯示子菜單*/
.nav .drop-down:hover .drop-sub{
display: block;
}
.nav .drop-down01:hover .drop-sub01{
display: block;
}
/* .nav li:hover a{color: blue;}*/
</style>
<script type="text/javascript">
function dianwo(x){
x.style.borderRadius="50px";
x.style.background="purple";
alert("^_^嘿嘿嘿嘿嘿");
x.style.width="200px"
}
</script>
</head>
<body ="dianwo(this)">
<div>
<ul class="nav">
<li><a href="#" style="width:350px;" onclick="dianwo(this)">滅絕老太等你很久了哦 來呀點(diǎn)我呀</a></li>
<li class="drop-down" onClick="while(1==1){alert('豬是念著倒')}"><a href="http://www.51spec.com" target="_blank">不要點(diǎn)我</a>
<ul class="drop-sub">
<li><a href="http://www.51spec.com" target="_blank">電氣電子</a></li>
<li><a href="http://www.51spec.com" target="_blank">傳感測量</a></li>
<li><a href="http://www.51spec.com" target="_blank">自動控制</a></li>
</ul>
</li>
<li class="drop-down01"><a href="http://www.51spec.com" target="_blank">品牌匯</a>
<ul class="drop-sub01">
<li><a href="http://www.51spec.com" target="_blank">霍尼韋爾</a></li>
<li><a href="http://www.51spec.com" target="_blank">高諾斯</a></li>
<li><a href="http://www.51spec.com" target="_blank">快達(dá)</a></li>
<li><a href="http://www.51spec.com" target="_blank">威圖</a></li>
</ul>
</li>
<li><a href="http://www.51spec.com" target="_blank">資料下載</a></li>
<li><a href="http://www.51spec.com" target="_blank">資訊中心</a></li>
</ul>
</div>
<img src="http://t1.27270.com/uploads/tu/201809/1136/2015-08-18_70def01fgw1ev75ykwnibj22rt45qkjo.jpg" alt="對象">
</body>
</html>
添削の先生：查無此人添削時間：2019-01-04 13:37:21
先生のまとめ：做的不錯，你的對象也不錯。少年，繼續(xù)努力。