第二十九节 display的none属性

我的梦境 提交于 2020-03-05 23:58:01
 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             width: 300px;
10             height: 300px;
11         }
12 
13         .box{
14             width: 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>

 

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!