HTML div鼠标悬停控制子控件显示与隐藏
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title></title> 6 <meta charset="utf-8" /> 7 <style type="text/css"> 8 #divF{ 9 width:300px; 10 height:300px; 11 background-color:coral; 12 } 13 #divF:hover #divC { 14 display:block; 15 } 16 #divC { 17 width: 300px; 18 height: 100px; 19 background-color: cadetblue; 20 display: none; 21 transition:all.5s; 22 } 23 </style> 24 </head> 25 <body> 26 27 <div id="divF"> 28 <div id="divC"> 29 30 </div> 31 </div> 32 </body> 33 </html>
