CSS-04-层叠选择器

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="UTF-8">
 5         <title></title>
 6         <style type="text/css">
 7             /*层叠选择器*/
 8             .ka{
 9                 width: 500px;
10                 height: 500px;
11                 border: 2px solid gray;
12                 background-color: green;
13             }
14             .ka #kb{
15                 width: 200px;
16                 height: 200px;
17                 border: 2px solid gray;
18                 background-color: greenyellow;
19             }
20             .ka #kc{
21                 width: 300px;
22                 height: 300px;
23                 border: 2px solid gray;
24                 background-color: orange;
25             }
26         </style>
27     </head>
28     <body>
29         <div class="ka">
30             <div id="kb"></div>
31             <div id="kc">
32                 <div id="kb"></div>
33             </div>
34         </div>
35         
36     </body>
37 </html>

 

posted @ 2019-07-24 18:02  我只是一个码农  阅读(168)  评论(0编辑  收藏  举报