兼容性,float

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6         <style>
 7             .box{
 8                 width: 400px;
 9                 border: 1px solid black;
10                 overflow:hidden;    <主盒子要消除浮动给否则包不住里面的内荣>
11             }
12             .let{
13                 float: left;
14                 background-color: red;
15             }
16             .right{
17                 float: right;
18                 background-color: blue;
19             }
20             h2{
21                 float: left;      <要使得h2不盛满一行就得给h2加一个浮动>
22                 margin: 0;
23                 height: 30px;
24             }
25         </style>
26         <!--
27             解决方案:float: left;
28         -->
29     </head>
30     <body>
31         <div class="box">
32             <div class="let">
33                 <h2>左边</h2>
34                 
35             </div>
36             <div class="right">
37                 <h2>右边</h2>
38             </div>
39 
40         </div>
41     </body>
42 </html>

 

转载于:https://www.cnblogs.com/hduhdc/p/5235160.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值