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>
HTML div鼠标悬停控制子控件显示与隐藏
原文地址:https://www.cnblogs.com/TinHead/p/8213714.html