【CSS】clear清除浮动

clear清除浮动
1、作用:
　　规定元素的某一侧不允许存在浮动元素

2、值:

【CSS】clear清除浮动

3、应用:
　　清除其他浮动元素对其产生的影响

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>清除浮动的应用</title>
 6     <style>
 7         #box-a{
 8             width: 200px;
 9             height: 200px;
10             background-color: red;
11             float: left;
12         }
13 
14         #box-b{
15             width: 300px;
16             height: 300px;
17             background-color: #ff0;
18             float: right;
19         }
20 
21         #box-c{
22             width: 800px;
23             height: 100px;
24             background-color:blue;
25             clear:right;
26         }
27     </style>
28 </head>
29 <body>
30     <div id="box-a">box a</div>
31     <div id="box-b">box b</div>
32     <div id="box-c">box c</div>
33 </body>
34 </html>

View Code