Div+Css實現圖層固定,吊窗

      在頁面中,經常會遇到這樣的效果,一個圖層總是在某一個位置,無論滾動條滾動與否,這個Div始終都在這個位置顯示。剛開始以爲是用js實現的,確實,可以利用js去實現,但是在css中有更好的方法。利用position屬性fixed,來實現Div相對於整個窗體的定位。

下面是菜鳥代碼,如果有更好的方法歡迎交流分享,也希望大神們可以對我的代碼提出寶貴意見。


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>index</title>
		<meta name="author" content="Administrator" />
		<!-- Date: 2014-08-04 -->
		<style type="text/css">
			body {margin:0;padding:0;}
			.container01{width:1002px;height:50px;background:#59A725;position:fixed;
			left:50%;margin-left:-501px;text-align:center;line-height:50px;}
			.container{margin: 0 auto;width: 1002px;height:1200px;padding-top:50px;
			background:#666600;}
		</style>
	</head>
	<body>
		<div class="container01">固定圖層</div>
		<div class="container">
			123
		</div>
	</body>
</html>


資源免費下載地址:http://download.csdn.net/detail/u014703834/7711777
發佈了35 篇原創文章 · 獲贊 7 · 訪問量 7萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章