<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<meta name="generator" content="editplus" />
<meta name="author" content="" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<style type="text/css">
div {
300px;
height:300px;
}
div:nth-child(1){
position:relative;
top:20px;
left:20px;
background-color:red;
font-size:40px;
text-align:center;
line-height:300px;
}
div:nth-child(2){
background-color:blue;
font-size:40px;
text-align:center;
line-height:300px;
}
div:nth-child(3){
font-size:40px;
text-align:center;
background-color:green;
line-height:300px;
}
</style>
</head>
<body>
<div>A</div>
<div>B</div>
<div>C</div>
</body>
</html>
绝对定位：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<meta name="generator" content="editplus" />
<meta name="author" content="" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<style type="text/css">
div {
300px;
height:300px;
}
div:nth-child(1){
position:absolute;
top:20px;
left:20px;
background-color:red;
font-size:40px;
text-align:center;
line-height:300px;
}
div:nth-child(2){
background-color:blue;
font-size:40px;
text-align:center;
line-height:300px;
}
</style>
</head>
<body>
<div>A</div>
<div>B</div>
</body>
</html>
