<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
1。 div 的 width默认是auto,高度是文字或者height决定
2。 浮动 (注意center要在left和right后面,不然会掉下去)
.left{
float: left;
width: 300px;
background: red;
height: 100px;
}
.right{
float: right;
width: 300px;
background: pink;
height: 100px;
}
.center{
background: yellow;
height: 100px;
}
3。 position 定位
.left{
position: absolute;
left: 0;
width: 300px;
background: red;
height: 100px;
}
.right{
position: absolute;
right: 0;
width: 300px;
background: pink;
height: 100px;
}
.center {
position: absolute;
right: 300px;
left: 300px;
background: yellow;
height: 100px;
}
</style>
</head>
<body>
<div class="left"></div>
<div class="right"></div>
<div class="center"></div>
</body>
</html>