首先來了解css的定位機制
css有三種基本的定位機制：普通流，浮動和絕對定位。
除非專門制定，否則所有框都在普通流中定位。也就是說，普通流中的元素的位置
由元素在html中的位置決定。
塊級框從上到下乙個接乙個地排列，框之間的垂直距離是由框的垂直外邊距計算出來。
行內框在一行中水平布置，可以使用水平內邊距，邊框和外邊距調整它們的間距。但是，垂直內邊距，邊框和內邊距不影響行內框的高度，有一行形成的水平框稱為行框，行框的高度總是足以容納它包含的所有行內款。不過，設定行高可以增加這個框的高度。
position屬性規定了元素的定位型別。
這個屬性定義建立元素布局所用的定位機制。任何元素都可以定位，不過絕對火固定元素會生成乙個塊級框，不論該元素本身是什麼型別，相對定位元素會相對於它在正常流中的預設位置偏移。
static 預設值，元素框正常生成。塊元素生成乙個矩形框。作為文件流的一部分，行內
元素則會建立乙個或多個行框，置於其父元素中。
absolute 生成絕對定位的元素，相對static定位以外的第乙個父元素進行定位，元素的位 置通過left,top,right,bottom進行規定。
元素框從文件流完全刪除，並相對於其包含塊定位，包含塊可能是文件中的另乙個元素或者是初始包含塊。元素原先在正常文件流中所佔的空間會關閉，就好像元素原本不存在一樣。元素定位後生成乙個塊級框，而不論原來它在正常流中生成何種型別的框。
fixed 生成絕對定位的元素，相對於瀏覽器視窗定位
relative 生成相對定位的元素，相對於其正常的位置進行定位（元素框偏移某個距離，元 素仍保持其為定位前的形狀，他原本所佔的空間任保留），因此.left:20 會向元 素的left位置新增20畫素
inherit 規定應該從父元素繼承position屬性的值
top:定義了乙個定位元素的上外邊距與其包含塊上邊界之間的偏移。
right,bottom,left以此類推
overflow:設定元素的內容溢位其區域發生的事情(hideen,scroll,auto)
vertical-align:設定元素垂直對齊的方式
z-index:設定元素的堆疊順序
CSS定位屬性
position 把元素放置到乙個靜態的 相對的 絕對的 或固定的位置中。top定義了乙個定位元素的上外邊距邊界與其包含塊上邊界之間的偏移。right 定義了定位元素右外邊距邊界與其包含塊右邊界之間的偏移。bottom 定義了定位元素下外邊距邊界與其包含塊下邊界之間的偏移。left 定義了定位元素左...
CSS 定位屬性
使用定位屬性可以控制元素的位置，包括相對定位和絕對定位兩種方式。相對定位是指允許元素在相對於文件布局的原始位置上進行偏移，而絕對定位是指允許元素與原始的文件布局分離且任意定位。1.1定位方式 position 使用定位方式屬性可以控制瀏覽器應如何定位html 元素。語法 position stati...
定位屬性CSS
第1個盒子 第2個盒子 第3個盒子 鏈結1鏈結2 鏈結3鏈結4 鏈結5 position屬性 static 預設值，沒有定位！relative 相對定位！相對於自身原來的位置！也就是現在的位置，按照定位能還原到原本的位置！設定相對定位的盒子，原本的位置會被留下來！absolute 絕對定位 相對於離...