CSS定位和滾動條

0805自我總結

一.絕對定位

position: absolute;

/*絕對定位：
一、定位屬性值：absolute
二、在頁面中再也不佔位(浮起來了)，就沒法繼承父級的寬度(必須本身自定義寬度)
三、一旦定位後，定位的佈局方位 top、bottom、left、right都能參與佈局
四、絕對定位的參考系是最近的定位父級(不是父級中的哪一點，而是四邊參照四邊)
五、左右同時存在，取左；同理上下取上
六、當父級定位了，子級參照父級定位，又能夠從新獲取父級寬度(也能夠在計算中拿到父級高度)
*/

position:fixed

生成絕對定位的元素，相對於瀏覽器窗口進行定位。

二.相對定位

position: relative;

父級(最近的一個父級)相對定位的目的

1）不影響自身佈局

2）輔助本身絕對定位佈局

三默認定位

position: static

默認值。沒有定位，元素出如今正常的流中（忽略 top, bottom, left, right 或者 z-index 聲明）。

四.繼承定位

position:inherit

規定應該從父元素繼承 position 屬性的值。

五.滾動條

overflow

• hidden:沒有滾動條,且內容只有規定區域的內容.

• visible:默認值沒有滾動條,這個屬性定義溢出元素內容區的內容會如何處理且顯示.

• scroll:這個屬性定義溢出元素內容區的內容會如何處理。若是值爲 scroll，不管是否須要，用戶代理都會提供一種滾動機制。所以，有可能即便元素框中能夠放下全部內容也會出現滾動條.

• auto:顯示滾動條,且內容只有規定區域的內容.