css學習筆記

這幾天都在學習css，由於以前接觸的比較少，只是會簡單得運用，所以學習起來有點困難，特別在布局方面，雖然網上好多例子，但是到現在我對布局還沒有系統的掌握。
布局通過position屬性進行的，它有以下幾種取值： 
 

static	預設值。無特殊定位，對象遵循HTML定位規則
absolute	將對象從文檔流中拖出，使用 left ， right ， top ， bottom 等屬性相對於其最接近的一個最有定位設定的父物件進行絕對位置。如果不存在這樣的父物件，則依據 body 對象。而其層疊通過 z-index 屬性定義
fixed	未支援。對象定位遵從絕對(absolute)方式。但是要遵守一些規範
relative	對象不可層疊，但將依據 left ， right ， top ， bottom 等屬性在正常文檔流中位移位置

   

說明：

檢索對象的定位方式。
設定此屬性值為 absolute 會將對象拖離出正常的文檔流絕對位置而不考慮它周圍內容的布局。假如其他具有不同 z-index 屬性的對象已經佔據了給定的位置，他們之間不會相互影響，而會在同一位置層疊。此時對象不具有外補丁( margin )，但仍有內補丁( padding )和邊框( border )。
要啟用物件的絕對(absolute)定位，必須指定 left ， right ， top ， bottom 屬性中的至少一個，並且設定此屬性值為 absolute 。否則上述屬性會使用他們的預設值 auto ，這將導致對象遵從正常的HTML布局規則，在前一個對象之後立即被呈遞。
設定此屬性值為 relative 會保持對象在正常的HTML流中，但是它的位置可以根據它的前一個對象進行位移。在相對(relative)定位對象之後的文本或對象佔有他們自己的空間而不會覆蓋被定位對象的自然空間。與此不同的，在絕對(absolute)定位對象之後的文本或對象在被定位對象被拖離正常文檔流之前會佔有它的自然空間。放置絕對(absolute)定位對象在可視地區之外會導致捲軸出現。而放置相對(relative)定位對象在可視地區之外，捲軸不會出現。
內容的尺寸會根據布局確定對象的尺寸。例如，設定一個 div 對象的 height 和 position 屬性，則 div 對象的內容將決定它的寬度( width )。
此屬性對於 currentStyle 對象而言是唯讀。對於其他對象而言是可讀寫的。
對應的指令碼特性為 position 。