css 定位position總結

2022-08-20 20:03:09 字數 292 閱讀 7815

在css中,position 屬性經常會用到,主要是絕對定位和相對定位,簡單的使用都沒有問題,尤其巢狀起來,就會有些混亂,今記錄總結一下,防止久而忘之。

我們最常用的的就是 absolute 和 relative 兩種方式,所以主要討論著兩者的區別。

相對定位我們主要是要知道相對於誰來進行偏移的?其實相對定位是相對於元素自己的本身的位置,我們來看一下例子: 

doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "">

title>

position定位總結

即沒有定位 遵循正常的文件流物件。生成絕對定位的元素,通常相對於瀏覽器視窗或 iframe 進行定位。元素的位置相對於瀏覽器視窗是固定位置。即使視窗是滾動的它也不會移動 這就如一些頁面上的側邊導航條一樣,不管你的頁面如何滾動,導航條的位置始終未有任何改變。生成相對定位的元素,相對定位元素的定位是相對...

CSS 定位position屬性

div h1 或 p 元素常常被稱為塊級元素。這意味著這些元素顯示為一塊內容,即 塊框 與之相反,span 和 strong 等元素稱為 行內元素 這是因為它們的內容顯示在行中,即 行內框 您可以使用 display 屬性改變生成的框的型別。將 display 屬性設定為 block,可以讓行內元素...

css實踐 position定位

position 用於設定目標物件的定位方式,一般有absolute relative static三個選項,設定後均可設定top bottom right left距離 absolute 允許物件漂浮於頁面之上,無須考慮周圍布局,如果父元素設定為static或者沒有設定,將以父元素的父元素為參考係...