css導航欄鼠標hover的時候就出現下拉菜單
阿新 • • 發佈：2017-06-25
har 下拉 lang 位置 set bili :hover 元素 div
代碼如下：
1 <!DOCTYPE html> 2 <html> 3 <head lang="en"> 4 <meta charset="UTF-8"> 5 <title></title> 6 <style type="text/css"> 7 .two{ 8 background-color: aqua; 9 width: 500px; 10 height: 200px; 11 } 12/*默認的threediv是隱藏的*/ 13 .three{ 14 background-color: black; 15 width: 100px; 16 height: 300px; 17 float: right; 18 visibility:hidden; 19 } 20 /*鼠標移動到twodiv就會改變threediv的visibility*/ 21 .two:hover>.three{ 22 visibility:visible; 23 } 24 </style> 25 </head> 26 <body> 27 <!---鼠標移到到的div----> 28 <div class="two"> 29 <!---默認隱藏的div----> 30 <div class="three"> 31 </div> 32 </div> 33 </body> 34 </html>
dispaly和visibility的區別
css導航欄鼠標hover的時候就出現下拉菜單