第二十九节 display的none属性

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Document</title>
 6     <style type="text/css">
 7         <!-- 使用display的none属性设置悬浮显示 -->
 8         .con{
 9              300px;
10             height: 300px;
11         }
12 
13         .box{
14              100px;
15             height: 100px;
16             background-color: gold;
17             display: none;
18         }
19 
20         .con:hover .box{
21             display: block;
22         }
23     </style>
24 </head>
25 <body>
26     <div class="con">
27         <h3>文字的标题</h3>
28         <div class="box">标题文字的说明</div>
29     </div>
30 </body>
31 </html>