1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <meta name="viewport" content="width=device-width, initial-scale=1.0">
6 <title>Document</title>
7 <style>
8 .outerDiv{
9 width: 500px;
10 height: 300px;
11 border: 1px solid rgb(236, 132, 132);
12 background-color: rgb(141, 228, 240);
13 }
14
15 .innerDiv{
16 width: 100px;
17 height: 100px;
18 border: 1px solid rgb(136, 232, 135);
19 /* 元素展示方式
20 display: inline; inline 行内元素宽高设置失效 */
21 }
22
23 .d1{
24 background-color: rgb(229, 237, 162);
25 float: left;
26 }
27
28 .d2{
29 background-color: rgb(249, 215, 170);
30 float: left;
31 }
32
33 .d3{
34 background-color: rgb(176, 176, 238);
35 float: left;
36 }
37
38 </style>
39 </head>
40 <body>
41 <!-- <div> 用来分割区域 -->
42 <div class="outerDiv">
43 <div class="innerDiv d1">div1</div>
44 <div class="innerDiv d2">div2</div>
45 <div class="innerDiv d3">div3</div>
46 </div>
47 </body>
48 </html>
标签：浮动,03,color,float,132,rgb,background,left From： https://www.cnblogs.com/IrVolcano/p/18061167