1. 程式人生 > >CSS 盒子模型,絕對定位和相對定位

CSS 盒子模型,絕對定位和相對定位

一、盒子模型:

        標準模式和混雜模式(IE)。在標準模式下瀏覽器按照規範呈現頁面;在混雜模式下,頁面以一種比較寬鬆的向後相容的方式顯示。混雜模式通常模擬老式瀏覽器的行為以防止老站點無法工作。

       

         

        CSS盒子模型具有內容(content)、填充(padding)、邊框(border)、邊界(margin)這些屬性。我們所說的width,height指的是內容(content)的寬高,一個盒子模型的寬度=:width+ pdding(寬) + border(寬),高度=height + padding(高) + border(高)。

二、絕對定位和相對定位:

       relative(相對定位) 物件不可層疊、不脫離文件流,參考自身靜態位置通過 top,bottom,left,right 定位,並且可以通過z-index進行層次分級。

absolute(絕對定位) 脫離文件流,通過 top,bottom,left,right 定位。選取其最近一個最有定位設定的父級物件進行絕對定位,如果物件的父級沒有設定定位屬性,absolute元素將以body座標原點進行定位,可以通過z-index進行層次分級。