摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>float 浮動</title> <style type="text/css"> *{paddi
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>float 浮動</title>
<style type="text/css">
*{padding: 0;margin: 0;}
ul li{
list-style: none;
float: left;
background: #9AA4FF;
margin: 5px;
padding: 10px;
border-radius: 5px;
}
ul li ul{display: none;}
ul li:hover ul{display: block;}
ul li ul li{float: none;}
</style>
</head>
<body>
<div class="nav">
<ul>
<li>一級菜單1
<ul>
<li>二級菜單</li>
<li>二級菜單</li>
<li>二級菜單</li>
</ul>
</li>
<li>一級菜單2
<ul>
<li>二級菜單</li>
<li>二級菜單</li>
<li>二級菜單</li>
</ul>
</li>
<li>一級菜單3
<ul>
<li>二級菜單</li>
<li>二級菜單</li>
<li>二級菜單</li>
</ul>
</li>
<li>一級菜單4
<ul>
<li>二級菜單</li>
<li>二級菜單</li>
<li>二級菜單</li>
</ul>
</li>
<li>一級菜單5
<ul>
<li>二級菜單</li>
<li>二級菜單</li>
<li>二級菜單</li>
</ul>
</li>
<li>一級菜單6
<ul>
<li>二級菜單</li>
<li>二級菜單</li>
<li>二級菜單</li>
</ul>
</li>
<li>一級菜單7
<ul>
<li>二級菜單</li>
<li>二級菜單</li>
<li>二級菜單</li>
</ul>
</li>
<li>一級菜單8
<ul>
<li>二級菜單</li>
<li>二級菜單</li>
<li>二級菜單</li>
</ul>
</li>
</ul>
</div>
</body>
</html>通過浮動練習一個二級菜單。
批改老師：查無此人批改時間：2019-07-08 09:21:40
老師總結(jié)：完成的不錯。浮動在移動端用到的比較多。繼續(xù)加油。