| <!DOCTYPE html> |
| |
<html lang="en"> |
| |
<head> |
| |
<meta charset="UTF-8"> |
| |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| |
<title>Document</title> |
| |
<style> |
| |
*{ |
| |
margin:0; |
| |
padding:0; |
| |
} |
| |
body,html{ |
| |
height:100%; |
| |
} |
| |
|
| |
.left{ |
| |
200px; |
| |
height:100%; |
| |
background:blue; |
| |
float:left; |
| |
} |
| |
.center{ |
| |
height:100%; |
| |
background:orange; |
| |
/* 触发BFC */ |
| |
overflow:hidden; |
| |
} |
| |
.right{ |
| |
200px; |
| |
height:100%; |
| |
background:green; |
| |
float:right; |
| |
} |
| |
</style> |
| |
</head> |
| |
<body> |
| |
|
| |
<div class="left"></div> |
| |
<div class="right"></div> |
| |
<div class="center"></div> |
| |
</body> |