如何使div的foot层置为最底部

2009-02-03 16:37:34 by 【6yang】, 85 visits, 收藏 | 返回

http://www.scriptlover.com/controls/FixedPosition/的解说

 

<!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>
<style type="text/css">
<!--
body {
  background: #FFFFFF;
  color: #333333;
  font-family: Arial, Helvetica, sans-serif;
  font-size: .75em;
  line-height: 140%;
  text-align: center;
  padding: 0;
  margin: 0;
}
body,html {
  height: 100%; 
}
* html, * html body {
  overflow: hidden;
}
a {
  text-decoration: underline;
  color: #8A0A0A;
}
a:hover,a:active {
  background: #A79C88;
  color: #FCF7F1;
  text-decoration: none;
}
#top {
  min-height: 90%; 
  overflow: auto; 
}
* html #top {
  height: 90%; /*IE中显示的高度*/
}
h1{
  display:block;
  font-size:2em;
  font-weight: bold;
  background: #EAE0D1;
  padding-top:24px;
  padding-bottom:20px;
  letter-spacing: 1px;
 
}
samp{
  display:block;
  background:#f1f1f1;
  font-size:1em;
  padding:6px;
  border-top:5px solid #8a0a0a;
  font-style:italic;
}
#show{
  margin:40px auto;
 width:600px;
}
#footer {
 clear:both;
  height:10%;
 border-top:5px solid #8a0a0a;
 background:#CAC3B5;
  line-height: 36px;
  vertical-align: middle;
 
}
address {
  padding-top: 1em;
  font-style: normal;
}
-->
</style>
</head>   
<body>
<div id="top">
 <h1>标题</h1>
 <samp>原文地址:<a href=http://www.6yang.net" title="">http://www.6yang.net</a></samp>
 <div id="show">
 内容<br />
 内容<br />
 内容<br />
 内容<br />
 内容<br />
 内容<br />
 内容<br />
 内容<br />
 内容<br />
 内容<br />
 内容<br />
 内容<br />
 内容<br />
 内容<br />
 内容<br />
 内容<br />
 内容<br />
 内容<br />
 内容<br />
 内容<br />
 内容<br />
 内容<br />
 内容<br />
 内容<br />
 内容<br />
 </div>
</div>
<div id="footer">
 <address>
 Design by <a href="http://www.6yang.net">6yang设计之谭</a> 本演示采用<a href="http://www.6yang.net/">创作共用授权</a>--署名和非商业用途。
 </address>/*address地址,用来显示部分版权*/
</div>
</body>
</html>

分享到:
share

    图片原图

    loading

    loading