使用浮动属性

样式一

image-20220903153135447

代码实现

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<style>
.box{background-color:green;}
.box{width:75%;height:100px;float:left}
.box1{background-color:red;}
.box2{background-color:yellow;}
.box1,.box2{height:50px;}
.box3{background-color:blue;float:right}
.box3{width:25%;height:100px;}
</style>
<div class="box">
<div class="box1">
1
</div>
<div class="box2">
2
</div>
</div>
<div class="box3">
3
</div>