固定定位是绝对定位的一个子类。唯一的区别是，对于固定定位框，它的包含块由可视窗口( viewport1 )创建。对于连续媒介，固定定位框并不随着文档的滚动而移动。从这个意义上说，它们类似于固定的背景图形。对于页面媒介，固定定位框在每页里重复。对于需要在每一页底部放置一个签名时，这个方法非常有用。
注意，IE6 中不支持固定定位( Fixed positioning )定位，通常的做法是使用绝对定位代替，并使用 Javascript 脚本控制绝对定位框的位置，使随页面滚动而相应的变化。
以下示例代码是修改自 W3C 官方使用固定定位布局的一个例子：
<!DOCTYPE HTML>
<HTML> <HEAD><TITLE>A frame document with CSS2.1</TITLE>
<STYLE type="text/css"> BODY { height: 8.5in } div { border: 1px solid red; } #header { position: fixed; 100%; height: 15%; top: 0; right: 0; bottom: auto; left: 0; } #sidebar { position: fixed; 10em; height: auto; top: 15%; right: auto; bottom: 100px; left: 0; } #main { position: fixed; auto; height: auto; top: 15%; right: 0; bottom: 100px; left: 10em; } #footer { position: fixed; 100%; height: 100px; top: auto; right: 0; bottom: 0; left: 0; }
</STYLE> </HEAD>
<BODY> <DIV id="header"> ...</DIV> <DIV id="sidebar"> ...</DIV> <DIV id="main"> ...</DIV> <DIV id="footer"> ...</DIV>
</BODY>
</HTML>
无论如何滚动页面，布局区域始终位于可视窗口中。
IE6 IE7(Q) IE8(Q) 不支持固定定位（position:fixed）
解决方案
在 IE6 IE7(Q) IE8(Q) 中为固定定位元素设置 'position:absolute'，再通过 JavaScript 脚本或者 CSS Expression 动态设置其偏移量。
参考代码如下：
<body style="font:12px Arial; _background-attachment:fixed; _background-image:url(about:blank);"> <div style="10000px; height:10000px;"></div>
<div id="d" style="position:fixed; top:0; left:0; _position:absolute; _top:expression_r(offsetParent.scrollTop); _left:expression_r(offsetParent.scrollLeft); background:#ddd; 100px; height:100px;"></div>
</body>