<!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{ | |
width:200px; | |
height:100%; | |
background:blue; | |
float:left; | |
} | |
.center{ | |
height:100%; | |
background:orange; | |
/* 触发BFC */ | |
overflow:hidden; | |
} | |
.right{ | |
width:200px; | |
height:100%; | |
background:green; | |
float:right; | |
} | |
</style> | |
</head> | |
<body> | |
<!-- 先写左右,后写中间板块 --> | |
<div class="left"></div> | |
<div class="right"></div> | |
<div class="center"></div> | |
</body> |
右侧赞助一下 代码改变世界一块二块也是爱