关于DIV嵌套（一）：margin布局小细节

在css+div布局中，经常会使用到div嵌套div的布局。

有的时候有的新手在使用div嵌套div的时候，想用margin直接控制嵌套在里面的div的位置。

但是，直接控制并不好用。不过我们可以通过float来用margin控制位置。

为嵌套的div加上float之后，便可随意布局。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>div嵌套布局</title>
		<style>
			#box01{
				width: 500px;
				height: 500px;
				background-color: #FF0000;
				margin:200px;
			}
			#box02{
				float: left;				
				width: 100px;
				height: 100px;
				background-color: #00FF00;
				margin: 200px ;		
			}			
		</style>
	</head>
	<body>		
		<div id="box01">
			<div id="box02">嵌套的div</div>
		</div>		
	</body>
</html>

　　

 

posted @ 2017-02-23 14:53  MJwilson  阅读(825)  评论(0)  编辑  收藏  举报