css定位方式有哪幾種

css定位方式有5種：1、浮動定位（float）。 2、static（靜態定位）；沒有定位，元素出現在正常的流中。 3、relative（相對定位）；元素脫離正常的文檔流。 4、absolute（絕對定位）。 5、fixed（固定定位）。

本教學操作環境：windows7系統、CSS3版、Dell G3電腦。

複雜的網頁佈局都是透過各種網頁元素靈活定位實現的，網頁中的各種元素定位都有自己的特色。下面我們來看看css的幾種定位方式。

float定位（即浮動定位）：

這種定位方式很簡單，只需規定一個浮動的方向（如：float:left;就表示這個元素向左邊擺放），它的定位是相對於父元素容器；

如果該元素設置了浮動，後面緊鄰的則會受到浮動的影響，因此需要後面的元素若要不受影響，則要在後面清除浮動（可用clear:both;等方法），在兩個相鄰元素設定相同浮動的情況下，兩個元素將依序相鄰擺放。這種定位使得元素脫離文檔流。

position定位：

position定位是指定位置的定位，以下為常用的幾種：

1、static（靜態定位）：

當我們沒有指定定位方式的時候，這時預設的定位方式就是static，也就是按照文件的書寫佈局自動分配在一個適當的地方，這種定位方式用margin來改變位置，對left、top、z- index等設定值無效，這種定位不脫離文檔流；

2、relative定位（相對定位）：

該定位是一種相對的定位，可以透過設定left、top等值，使得指定元素相對其正常的位置進行偏移，這種定位不脫離文檔流；

3、absolute定位（絕對定位）：

這種定位透過設定top 、right、bottom、left這些偏移值，相對於static 定位以外的第一個父元素進行定位（這種定位通常設置父元素為relative定位來配合使用），在沒有父元素的條件下，它的參考為body，該方式脫離文件流；

4、fixed（固定定位）：

這種定位方式是相對於整個文件的，只需設定它相對於各個方向的偏移值，就可以將該元素固定在頁面固定的位置，通常用來顯示一些提示訊息，脫離文檔流；

（學習視頻分享：css視頻教程）

以上是css定位方式有哪幾種的詳細內容。更多資訊請關注PHP中文網其他相關文章！