<!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=gb2312" />
<title>英语系网站</title>
<link href="english.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="body">
<div id="header"><span class="titleleft"><a href="7717060@sina.com">联系我们</a></span><span class="titleright">在线人数</span></div>
<div id="barner">
<img src="banner.jpg" width="860" height="100" />
</div>
<div id="links">
<ul>
<li><a href="#">系内新闻</a></li>
<li><a href="#">系内通知</a></li>
<li><a href="#">部门工作</a></li>
<li><a href="#">精品活动</a></li>
<li><a href="#">文件下载</a></li>
<li>网上聊天</li>
<li>最新留言</li>
</ul>
</div>
<div id="newsArea"><div id="title"><span class="titleleft">系内通知</span><span class="titleright">更多消息</span></div></div>
<div id="afficheArea"><div id="title"><span class="titleleft">系内新闻</span><span class="titleright">更多内容</span></div></div>
<div id="registerArea">
<div id="title"><span class="titleleft">用户登陆</span></div>
<form action="1.html" method="post" />
<p>用户: <input type="text" name="username" id="input"/></p>
<p>密码: <input type="password" name="password" id="input"/></p>
<p><input type="submit" value="登陆" /> <input type="submit" value="注册" /></p>
</form>
</div>
<div id="instroduceArea"><div id="title">
<span class="titleleft">英语系简介</span></div>
<p>英语系建立于2004年,英语系建立于2004年英语系建立于
英语系建立于2004年英语系建立于2004年英语系建立于2004年
英语系建立于2004年英语系建立于2004年英语系建立于2004年
英语系建立于2004年英语系建立于2004年英语系建立于2004年.</p>
</div>
<div id="pictureArea"><div id="title"><span class="titleleft">学生风采</span><span class="titleright">更多内容</span></div></div>
<div id="left"><div id="title"><span class="titleleft">部门活动</span><span class="titleright">更多内容</span></div></div>
<div id="middle"><div id="title"> <span class="titleleft">文件下载</span><span class="titleright">更多内容</span></div></div>
<div id="right"><div id="title"><span class="titleleft">最新留言</span><span class="titleright">更多内容</span></div></div>
<div id="footer">
<p>版权:© XXXXXXXXXXXXX学院-英语系</p>
<p>Copyright: English Department</p>
</div>
</div>
</body>
</html>
/* CSS Document */
body{
margin:0px;
font-family:Arial, Helvetica, sans-serif;
font-size:16px;
text-decoration: none;
}
a:link{ color: #000; text-decoration: none;background-color:inherit;}
a:visited{ color: #000; text-decoration: none;background-color:inherit;}
a:hover{ color: #014898; text-decoration: none;background-color:inherit;}
a:active{ color: #000; text-decoration: none;background-color:inherit;}
#body{
margin: 0 auto;
width:860px;
height:1200px;
border:1px solid #000000;
position:relative;
}
#header{
width:860px;
height:20px;
background:#00499c;
font-size:14px;
}
#barner{
width:860px;
height:100px;
background:#999999;
}
#links{
width:860px;
height:25px;
background:#00499c;
border-bottom:4px solid #999999;
}
#links ul{
padding:4px;
margin:0;
}
#links ul li{
float:left;
display:block;
width:90px;
text-decoration:none;
font-size:14px;
color:#FFFFFF;
}
#newsArea{
width:240px;
position:absolute;
top:160px;
left:10px;
height:400px;
border:1px solid #000000;
}
#title{
width:100%;
position:absolute;
top:0px;
height:20px;
border-bottom:1px solid #000000;
font-size:12px;
background:#00499c;
color: #FFFFFF;
}
#afficheArea{
width:350px;
height:250px;
position:absolute;
top:160px;
left:260px;
border:1px solid #000000;
}
#pictureArea{
width:840px;
height:200px;
position:absolute;
top:575px;
left:10px;
border:1px solid #000000;
}
#registerArea{
width:230px;
height:250px;
position:absolute;
top:160px;
left:621px;
border:1px solid #000000;
text-align:left;
}
#registerArea p{
width:200px;
text-align:center;
margin-left:-20px;
padding-top:20px;
}
#instroduceArea{
width:590px;
height:140px;
position:absolute;
top:420px;
left:260px;
border:1px solid #000000;
font-size:16px;
}
#instroduceArea p{
padding:30px 37px 4px 27px;
}
#input{ width:110px; margin-top:5px; border:#999 1px solid; height:15px;}
#registerArea p
{
position:relative;
left:30px;
top:25px;
}
#left
{
width:270px;
height:290px;
border:1px solid #000000;
position:absolute;
top:790px;
left:10px;
}
#middle
{
width:280px;
height:290px;
border:1px solid #000000;
position:absolute;
top:790px;
left:290px;
}
#right
{
width:270px;
height:290px;
border:1px solid #000000;
position:absolute;
top:790px;
left:580px;
}
#footer{
width:860px;
height:100px;
position:absolute;
top:1100px;
border-top:1px solid #000000;
background:#00499c;
}
#footer p{
text-align:center;
font-size:12px;
font-family:Arial, Helvetica, sans-serif;
padding-top:10px;
}
/*-----------------------------------------------*/
.titleleft{
float:left;
padding-left:10px;
padding-top:2px;
}
.titleright{
float:right;
padding-right:10px;
padding-top:2px;
}
.titlecenter{
float:none;
text-align:center;
}