tsailer 发表于 2013-2-7 15:00:43

one div as the other one's background

method 1
<!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">
<!--
.top{height:200px;width:300px;background:#FF0000;z-index:11;position:absolute;}
.back{height:200px;width:300px;background:#00FF00;position:absolute;z-index:0;}
-->
</style>
</head>

<body>
<div class="top"></div>
<div class="back"></div>
</body>
</html>
method 2
<!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">
<!--
.back{height:200px;width:300px;background:#00FF00;}
.top{height:200px;width:300px;background:#FF0000;margin-top:-200px;}
-->
</style>
</head>

<body>
<div class="back"></div>
<div class="top"></div>
</body>
</html>
method 3
<!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">
<!--
.back{height:200px;width:300px;background:#00FF00;}
.top{height:200px;width:300px;background:#FF0000;position:absolute;}
-->
</style>
</head>
<body>
<div class="top"></div>
<div class="back"></div>
</body>
</html>
页: [1]
查看完整版本: one div as the other one's background