css中的定位簡介

2021-07-30 14:45:25 字數 832 閱讀 8721

1.css中的定位position:

fixed                    固定定位(脫離文件流)

relative   相對定位(沒有脫離文件流)

absolute              絕對定位(脫離文件流)

2.position:fixed定位

fixed定位即固定定位。使用固定定位的元素即固定在某點不會隨瀏覽器的滑動而改變位置。

fixed定位最常見的情況就是頁面的廣告。廣告一般都是固定在某個位置不會隨著瀏覽器動的。

3.position:relative定位

relative定位即相對定位。相對定位的參照標準是該元素原本位置。並且對元素使用相對定位之後該元素的原本                                   位置也會得到保留,所以說相對定位是不會脫離文件流的。、、

relative相對定位一般不會單獨使用,他都是作為絕對定位的參照元素使用的。

4.position:absolute定位

absolute定位即絕對定位。絕對定位是相對於離自己最近的已定位的父元素來改變位置,如果沒有,那麼就會相                                 對與頁面就行定位。

5.這三種定位都是根據:left(距離左端。。)

right

topbottom這四個方向來改變位置的。

6.使用了定位的元素都會變成塊級元素,但是也沒有了寬和高(設定了浮動的元素也是沒有了寬和高的,需要自己設定)。

7.z-index屬性:

乙個元素的堆疊順序即哪個元素在上面哪個元素在下面顯示的設定。

z-index可以是正數或者是負數。

css中的定位

本文只是個額外的說明,作為基礎知識的補充和額外的關注點 定位的分類以及預設定位 fix,static,relative,absolute 各個定位的包含塊是怎麼樣的 1.relative和static的包含塊由最近的塊級框,表單元格或行內塊祖先框的內容邊界構成 2.fixed的包含塊是視窗本身 3....

css中的定位

在css中避免不了定位,在實際開發中,關於定位模組有很多,定位有三種型別,絕對定位,相對定位,固定定位 1.絕對定位 position absolute 絕對定位 使元素脫離文件流,使元素提公升了半個層級 如果不指定定位父級,那麼絕對定位相對於文件可視區定位 塊元素 寬度不自適應,如果不設定大小,大...

CSS中的定位

static定位 position static 是元素在文件流中的預設定位,一般不會顯示寫出來,他會按照先後順序排列元素。fixed 定位 position fixed 跟他的名字一樣,使用這個定位,可以讓元素釘 在螢幕可視區域中,定位也是 相對於可視區域定位的。relative相對定位 posi...