當元素的position屬性值為absolute時，這個元素就變成了絕對定位元素。絕對定位在幾種定位方法中使用最廣泛，這種方法能夠很精確地把元素移動到任意你想要的位置。
一個元素變成了絕對定位元素，這個元素就完全脫離正常文檔流了，絕對定位元素的前面或者後面的元素會認為這個元素並不存在，即這個元素浮於其他元素上面，它是獨立出來的。
什麼叫“脫離正常文檔流”，請參考“正常文檔流”這一節。
語法：
position:absolute; top:像素值; bottom:像素值; left:像素值; right:像素值;
說明：
“position:absolute;”是結合top、bottom、left和right這4個屬性一起使用的，其中“position:absolute;”使得元素成為絕對定位元素，接著使用top、bottom、left和right這4個屬性來設置元素相對浏覽器的位置。
現在，我們暫且可以這樣理解：CSS固定定位元素和CSS絕對定位元素的位置是相對於浏覽器而言，而CSS相對定位元素的位置是相對原始位置而言。
舉例：
在線測試
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS絕對定位</title>
<style type="text/css">
#father
{
padding:15px;
background-color:#0C6A9D;
border:1px solid silver;
}
#father div
{
padding:10px;
background-color:#FCD568;
border:1px dashed red;
}
#son2
{
/*在這裡添加son2的定位方式*/
}
</style>
</head>
<body>
<div id="father">
<div id="son1">box1</div>
<div id="son2">box2</div>
<div id="son3">box3</div>
</div>
</body>
</html>
在浏覽器預覽效果如下：
我們為第2個div元素son2添加如下代碼：
#son2
{
/*在這裡添加son2的定位方式*/
position:absolute;
top:0;
right:0;
}
在浏覽器預覽效果如下：
分析：
至此，我們已經把最重要的3種定位方式都學完了，在初學者階段，對於固定定位元素、相對定位元素和絕對定位元素，我們暫且這樣記憶：默認情況下，固定定位元素和絕對定位元素的位置是相對於浏覽器而言，而相對定位元素的位置是相對原始位置而言。
大部分人看到這裡就會疑惑了，“固定定位元素和絕對定位元素的位置是相對於浏覽器而言，而相對定位元素的位置是相對原始位置而言”這句話真的正確嗎？不正確！正確的描述要加一個前提→“默認情況下”。
在這裡，很多初學者會對各種定位元素的相對位置有很多的疑問，大家不要擔心，浮動與定位可以說是CSS中最靈活和最困難的知識點。不過在“CSS進階教程”中，我們會詳細而深入地去學習，到時候， 學友們就可以100%理解定位布局的本質。
教程寫到這的時候，看看時間，凌晨1點35分。額，為了咱親們，站長helicopter也算是“鞠躬盡瘁，死而後已”了。不啰嗦了，該睡了~~