分享CSS固定DIV，導航條頂部固定fixed

fixed 生成絕對定位的元素，相對於瀏覽器窗口進行定位。 元素的位置通過 "left", "top", "right" 以及 "bottom" 屬性進行規定。

但是在IE6下，並不支持position:fixed屬性，這個時候我們需要對IE6進行hack處理。解決的方案是使用postion:absolute屬性，它的作用大家都很熟悉，相對於父元素進行絕對定位，然後我們可以通過expression來改變#ads的top值。

什麼是expression？
expression的定義：IE5及其以後版本支持在CSS中使用expression，用來把CSS屬性和Javascript表達式關聯起來，這裏的CSS屬性可以是元素固有的屬性，也可以是自定義屬性。就是說CSS屬性後面可以是一段Javascript表達式，CSS屬性的值等於Javascript表達式計算的結果。在表達式中可以直接引用元素自身的屬性和方法，也可以使用其他瀏覽器對象。這個表達式就好像是在這個元素的一個成員函數中一樣。

重要代碼如下：（注意css中對IE6兼容的處理）

/* 實例CSS */
html{ _background:url(about:blank);} /*阻止閃動 in IE6 , 把空文件換成about:blank , 減少請求*/
body{ font-size:12px; font-family:Arial,Tahoma,sans-serif; color:#EEEEEE; text-align:center; background:#E2E2E2;}
#header{
    width:100%;
    height:80px;
    line-height:80px; 
    background:#333
}
#topToolbar{
    _display:none;
    width:100%;
    height:40px;
    line-height:40px;
    background:#333;
    position:fixed;
    top:-40px;
    left:0;
    _top:0;
    _position:absolute;
    _top:expression(documentElement.scrollTop);
}
#content{
    border:1px solid #f00;
    width:880px;
    height:1390px;
    margin:auto
}
#bottomToolbar{
    width:100%;
    height:40px;
    line-height:40px;
    background:#333;
    position:fixed;
    bottom:0;
    left:0;
    _position:absolute;
    _top:expression(documentElement.scrollTop+documentElement.clientHeight-this.offsetHeight);
    /*
        document.body.scrollTop 網頁滾動的距離
        document.body.clientHeight 網頁可見區域高
        this.offsetHeight 當前元素的高度
    */
}
網頁導航條設計
來源：http://www.huiyi8.com/daohang/daohangtiao/