abstract：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>網(wǎng)頁(yè)導(dǎo)航</title> <script src="../Jquery/jquery-3.4.1.min.js"></script> <
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>網(wǎng)頁(yè)導(dǎo)航</title>
<script src="../Jquery/jquery-3.4.1.min.js"></script>
<link rel="stylesheet" type="text/css" href="list1.css"/>
<script>
$(document).ready(function(){
// 隱藏2-3級(jí)下拉菜單
$('.twobox').hide()
$('.three').hide()
$('.one>li').mouseover(function(){
$(this).find('.twobox').slideDown(500)
})
$('.one>li').mouseleave(function(){
$(this).find('.twobox').slideUp(500)
})
$('.two').mouseover(function(){
$(this).find('.three').slideDown(500)
})
$('.two').mouseleave(function(){
$(this).find('.three').slideUp(500)
})
})
</script>
</head>
<body>
<div class="menu">
<!-- 一級(jí)下拉菜單 -->
<ul class="one">
<li>首頁(yè)</li>
<li>產(chǎn)品
<!-- 二級(jí)菜單 -->
<ul class="twobox">
<li>產(chǎn)品1</li>
<li class="two">電腦類型
<ul class="three">
<li>筆記本1</li>
<li>筆記本2</li>
<li>筆記本3</li>
<li>筆記本4</li>
<li>筆記本5</li>
</ul>
</li>
<li class="two">產(chǎn)品3
<ul class="three">
<li>手機(jī)1</li>
<li>手機(jī)2</li>
<li>手機(jī)3</li>
<li>手機(jī)4</li>
<li>手機(jī)5</li>
</ul>
<li>拍照系列</li>
</li>
</ul>
</li>
<li>公司新聞
<ul class="twobox">
<li>公司新聞1</li>
<li class="two">公司新聞2
<ul class="three">
<li>今日頭條</li>
<li>午夜劇場(chǎng)</li>
<li>聚焦點(diǎn)擊</li>
<li>榜上頭條</li>
</ul>
<li>公司新聞3</li>
<li>公司新聞4</li>
</li>
</ul>
</li>
<li>行業(yè)資訊</li>
<li>聯(lián)系我們</li>
</ul>
</div>
</body>
</html>
Correcting teacher：天蓬老師Correction time：2019-05-17 17:39:42
Teacher's summary：像這種下拉菜單 , 實(shí)現(xiàn)方案很多的, 純css也行, js也可以了, 大多與定位相關(guān)