![4335cca99a84b5f044f3ae7c86190fc6]()
验证文档流的显示顺序
<html>
<head>
<meta charset="UTF-8">
<title>验证文档流的显示顺序</title>
<style type="text/css">
*(margin:0;padding:0}
·parent{
margin:0 auto;
width:1000px;
/*高度*/
overflow:hidden;/*子级元素浮动后,导致父级高度塌陷的解决方法*/
background-color:yellow;
.sonl{
float:left;
width:250pxi
height:200px;
background-color:red;
.son2{
float:left;
width:250pxi
height:200px;
background-color:blue;
.son3{
float:left;
width:250px;
height:200px;
background-color:green;
.son4(
float:left;
width:250pxi
height:200px;
background-color:purple;
</style>
</head>