abstrait:<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Document</title><style>*{margin:0; padding:0;}div{width:1260px;height:40px;background:#1E1E1
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
*{margin:0; padding:0;}
div{width:1260px;height:40px;background:#1E1E1E;margin:0 auto;}
a{text-decoration: none;color:#fff;display:inline-block; width:100px;height:40px;line-height: 40px;text-align: center;position: relative;}
a:hover ul{display:block;}
ul{position: absolute;width:100px;border:1px solid #ccc;top:40;left:0;display: none;}
li{list-style: none; color:#000;}
</style>
</head>
<body>
<div>
<a href="">首頁</a>
<a href="">下拉菜單1
<ul>
<li>子菜單</li>
<li>子菜單</li>
<li>子菜單</li>
</ul>
</a>
<a href="">下拉菜單2
<ul>
<li>子菜單</li>
<li>子菜單</li>
<li>子菜單</li>
</ul>
</a>
<a href="">下拉菜單3
<ul>
<li>子菜單</li>
<li>子菜單</li>
<li>子菜單</li>
</ul>
</a>
</div>
</body>
</html>
css實(shí)現(xiàn)下拉菜單可以使用定位,同時(shí)利用display:none將下拉菜單隱藏。利用hover將display改為block即可以實(shí)現(xiàn)下拉菜單。
Professeur correcteur:天蓬老師Temps de correction:2019-04-01 09:43:43
Résumé du professeur:display屬性, 是每個(gè)標(biāo)簽都有的原生屬性, 它的功能非常強(qiáng)大, 決定了這個(gè)標(biāo)簽的出身和使用場景