您的位置: 首页 > 源码资料
始终固定在顶部和底部的css+DIV,兼容ie6和FF等所有浏览器
源码资料 时间:2013-09-26 作者/发布人:科杰在线 点击:3266
<!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>始终固定在顶部和底部的css+DIV,兼容ie6和FF等所有浏览器 科杰在线pc354.com</title>
<style type="text/css">
*{margin:0px;padding:0px;}
body{_background-image:url(about:blank);/*用浏览器空白页面作为背景*/_background-attachment:fixed; /* prevent screen flash in IE6 确保滚动条滚动时，元素不闪动*/ }
/*下面的top:0;表示居顶固定,改为bottom:0;即固定在底部*/
#topNav{position:fixed;z-index:100;top:0;left:0;_position:absolute;_top:expression(documentElement.scrollTop + 0 + "px");_left:expression(documentElement.scrollLeft + 0 + "px");} #topNav{width:100%;height:35px;overflow:hidden;background:url(images/pc354.jpg) repeat-x;}
#topNav div{margin:0 auto;width:1000px;}
.mask{width:1000px;margin:45px auto 0 auto;}
</style>
</head>
<body>
<div id="topNav"><div><a href="http://www.pc354.com/" target="_blank"><img src="images/pc354.jpg" width="1000" height="35" alt="" /></a></div></div>
<div class="mask"><a href="http://www.pc354.com/" target="_blank"><img src="images/pc354.jpg" width="1000" height="1200" alt="科杰在线" /></a></div>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>始终固定在顶部和底部的css+DIV,兼容ie6和FF等所有浏览器 科杰在线pc354.com</title>
<style type="text/css">
*{margin:0px;padding:0px;}
body{_background-image:url(about:blank);/*用浏览器空白页面作为背景*/_background-attachment:fixed; /* prevent screen flash in IE6 确保滚动条滚动时，元素不闪动*/ }
/*下面的top:0;表示居顶固定,改为bottom:0;即固定在底部*/
#topNav{position:fixed;z-index:100;top:0;left:0;_position:absolute;_top:expression(documentElement.scrollTop + 0 + "px");_left:expression(documentElement.scrollLeft + 0 + "px");} #topNav{width:100%;height:35px;overflow:hidden;background:url(images/pc354.jpg) repeat-x;}
#topNav div{margin:0 auto;width:1000px;}
.mask{width:1000px;margin:45px auto 0 auto;}
</style>
</head>
<body>
<div id="topNav"><div><a href="http://www.pc354.com/" target="_blank"><img src="images/pc354.jpg" width="1000" height="35" alt="" /></a></div></div>
<div class="mask"><a href="http://www.pc354.com/" target="_blank"><img src="images/pc354.jpg" width="1000" height="1200" alt="科杰在线" /></a></div>
</body>
</html>
--------------------------全文完----------------------------
0% (0)
0% (0)
