利用伪元素让父级包裹住浮动元素 

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6     <style>
 7 
 8         .wrapper::after{
 9             content:"";
10             clear:both;
11             display:block;
12         }
13 
14         .wrapper{
15             border:1px solid black;
16         }
17 
18         .content{
19             float:left;
20             width:100px;
21             height:100px;
22             background-color:black;
23             color:white;
24         }
25 
26     </style>
27 </head>
28 <body>
29 
30     <div class="wrapper">
31         <div class="content">1</div>
32         <div class="content">2</div>
33         <div class="content">3</div>
34 
35     </div>
36 
37 </body>
38 </html>

 

posted @ 2018-07-19 10:25  GCat  阅读(439)  评论(0)  编辑  收藏  举报