????:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0">&
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<style>
*{margin:0px;padding:0px;}
li{list-style-type: none;color:mintcream;background-color: mediumpurple;}
.ul1 li{float:left;width:80px;height:40px;text-align:center;line-height: 40px;font-size:15px;}
.ul3 li{position:relative;left:80px;top:-40px;}
li:hover{background-color:orchid;}
a{display:block;width:40px;height: 40px;box-shadow: 0 0 10px;border-radius:50%;float:left;margin:30px;
text-align: center;line-height: 40px;text-decoration: none;}
</style>
</head>
<body>
<nav style="margin:0 auto;width:60%;height:40px;background-color: #f5f5f5;">
<ul class="ul1">
<li>首頁(yè)</li>
<li>學(xué)習(xí)
<ul class="ul2">
<li>一年級(jí)</li>
<li>二年級(jí)</li>
<li>三年級(jí)</li>
<li>四年級(jí)
<ul class="ul3">
<li>語(yǔ)文</li>
<li>數(shù)學(xué)</li>
<li>英語(yǔ)</li>
</ul>
</li>
<li>五年級(jí)</li>
<li>六年級(jí)</li>
</ul>
</li>
<li>測(cè)試
<ul class="ul2">
<li>一年級(jí)</li>
<li>二年級(jí)</li>
<li>三年級(jí)</li>
<li>四年級(jí)
<ul class="ul3">
<li>語(yǔ)文</li>
<li>數(shù)學(xué)</li>
<li>英語(yǔ)</li>
</ul>
</li>
<li>五年級(jí)</li>
<li>六年級(jí)</li>
</ul>
</li>
<li>課外
<ul class="ul2">
<li>音樂(lè)</li>
<li>美術(shù)</li>
<li>信息</li>
<li>體育</li>
</ul>
</li>
</ul>
</nav>
<main style="margin:5px auto;width:60%;height:400px;background-color: #f5f5f5;">
<a href="">1</a>
<a href="">2</a>
<a href="">3</a>
<a href="">4</a>
<div style="clear:both;"></div>
<button style="width:80px;height:50px;">tap</button>
</main>
<script>
$(document).ready(function(){
$('.ul2').hide();
$('.ul3').hide();
$('.ul1>li').mouseover(function(){
$(this).find('.ul2').slideDown(100)
})
$('.ul1>li').mouseleave(function(){
$(this).find('.ul2').slideUp(100)
})
$('.ul2>li').mouseover(function(){
$(this).find('.ul3').slideDown(100)
})
$('.ul2>li').mouseleave(function(){
$(this).find('.ul3').slideUp(100)
})
var n1=0
$('button').click(function(){
var a1=document.querySelectorAll('a')
for (var i=0;i<a1.length;i++){
a1[i].style.backgroundColor='rgb('+Math.floor(Math.random()*256)+','+Math.floor(Math.random()*256)+','+Math.floor(Math.random()*256)+')'
a1[i].innerHTML=Math.floor(Math.random()*100)
}
})
})
</script>
</body>
</html>
?? ???:韋小寶?? ??:2019-02-11 09:14:31
???? ??:寫(xiě)的很不錯(cuò) 主要是練習(xí)了很多函數(shù) 這些函數(shù)在以后的開(kāi)發(fā)中可能都會(huì)起到作用