菜单界面设计
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>菜单界面设计</title>
<style>
*
{
margin:0px;
padding:0px;}
#a
{
width:96%;
height:220px;
position:relative;
border:1px solid red;
left:2%;
}
#logo
{
width:22%;
height:80px;
position:relative;
border:1px solid blue;
top:20%;
left:36%
}
#logo1
{
width:22.9%;
height:170px;
position:relative;
border:1px solid blue;
top:-15%;
left:5%;}
#logo2
{
width:5%;
height:60px;
position:relative;
border:1px solid blue;
top:-100%;
left:78%;}
#logo3
{
width:2.5%;
height:50px;
position:relative;
border:1px solid blue;
top:-105%;
left:70%;}
</style>
<style>
*
{
margin:0px;
padding:0px;}
.qwer
{
width:100%;
height:46px;
position:relative;
border:1px solid red;
top:-67.5%;
left:-0.1055558%;
}
.qwer1
{
width:13.5%;
height:40px;
position:relative;
border:1px solid green;
float:left;
top:2px;
margin-left:7.5px;
}
</style>
<style>
*
{
margin:0px;
padding:0px;}
#banju{
width:100%;
height:940px;
position:relative;
border:1px solid red;
top:-150px;
}
#banju1
{
width:20%;
height:200px;
position:relative;
border:1px solid #C06;
top:3px;
left:5%;}
#banju1.1
{
width:20%;
height:200px;
position:relative;
border:1px solid #C06;
top:3px;
left:5%;}
#banju2
{
width:65%;
height:40px;
position:relative;
border:1px solid #C06;
top:-455px;
left:28%}
#banju3
{
width:58%;
height:200px;
position:relative;
border:1px solid #C06;
top:-455px;
left:32%;}
</style>
<style>
*
{
margin:0px;
padding:0px;}
#xiabu
{
width:100%;
height:60px;
position:relative;
border:1px solid red;
top:-148px;
}
#xiabu1
{
width:100%;
height:140px;
position:relative;
border:1px solid red;
top:-148px;
}
</style>
</head>
<body>
<div id="a">
<div id="logo"></div>
<div id="logo1"><img src="7SG$YUQ_{37500[9QCEX`KK.png" width="295" /></div>
<div id="logo2"></div>
<div id="logo3"></div>
<div id="logo4"></div>
<div>
</div>
<div class="qwer">
<div class="qwer1"></div>
<div class="qwer1"></div>
<div class="qwer1"></div>
<div class="qwer1"></div>
<div class="qwer1"></div>
<div class="qwer1"></div>
<div class="qwer1"></div>
</div>
<div>
<div id="banju">
<div id="banju1"></div><br />
<br />
<br />
<div id="banju1"></div>
<div id="banju2"></div>
<br />
<div id="banju3"></div>
<br />
<div id="banju3"></div>
<br />
<div id="banju3"></div>
<br />
<div id="banju3"></div>
</div>
<div id="xiabu"><img src="未标题-1.jpg" width="100%" height="200px"></div>
<div id="xiabu1"></div>
</body>
</html>
