DIV CSS中的絕對定位和相對定位的區別菜鳥就不用近來了

時間 2022-07-29 17:05:14

1樓:匿名使用者

div+css佈局很少用定位,除非做些特效或有必要才定位。

div的佈局就像**那樣巢狀,

如果要問絕對定位好還是用相對定位好?

因為絕對定位(和文件流沒關係)如無申明,則其是對與body而言的,處理不好的話。如顯示器尺寸變了,可能就會變型。

相對定位的元素屬文件流,所以穩定的,相對定位是相對他該出現的位置,如無設top left之類,和普通div基本一樣。

一般的絕對定位是這樣用的,父元素要是相對定位的且須有佈局,如有個高度,這樣子元素用絕對定位,就可以相對它的父元素進行絕對定位,父元素若不這樣做,那麼子元素用絕對定位其實是相對body定位。

2樓:長安縣令

絕對定位一般用在對應螢幕左邊和上邊的位置和座標定位

相對定位一般用在適應螢幕中間的位置和座標定位

div+css中的絕對定位和相對定位的區別~~~

3樓:之之小蟲

先看一抄下定義

position:relative|absolute|static|fixed

◆static沒有特別bai的設定,遵循基本的du定位規定,不能通過z-index進行zhi層次分級。

◆relative不脫離文件流,dao參考自身靜態位置通過top,bottom,left,right定位,並且可以通過z-index進行層次分級。

◆absolute脫離文件流,通過top,bottom,left,right定位。選取其最近的父級定位元素,當父級position為static時,absolute元素將以body座標原點進行定位,可以通過z-index進行層次分級。

◆fixed固定定位,這裡他所固定的對像是可視視窗而並非是body或是父級元素。可通過z-index進行層次分級。

一般來說

relative就是相對定位 他位置是參照自身原來的位置定位的,定義中說"不脫離文件流"就是說文件會預留原來的位置.

注意的是absolute絕對對定位:

他參照的定位分兩個情況:

1.父對像沒有設定position或position為static;它參照的就是body座標原點.

2.其它時候時候它參照的是父對像的左上角座標.

4樓:阿呆之一

前面兩個連結說的挺bai

明白的,一個是du相對整個頁面的定zhi位,一個是相對於原dao來「應該」內所在位置進容行定位

也說是說絕對定位是距離頁面左上角的距離,相對定位是比如不進行定位本來應該在的位置,相對定位後是從不定位的位置開始算起

5樓:匿名使用者

絕對du定zhi位dao

版相對權定位

css絕對定位和相對定位的區別

6樓:山東文匯軟體

一:絕對定位

position: absolute;絕對定位:絕對定位是相對於元素最近的已定位的祖先元素(即是設定了絕對定位或者相對定位的祖先元素)。

如果元素沒有已定位的祖先元素,那麼它的位置則是相對於最初的包含塊(body)。

絕對定位本身與文件流無關,因此不佔空間,普通文件流中的元素的佈局就當絕對定位的元素不存時一樣,所以 它們可以覆蓋頁面上其他的元素,且可以通過z-index屬性來控制這些層的對方順序。

#box_relative

二:相對定位

position: relative;相對定位:相對定位是相對於元素在文件中的初始位置——首先它出現在它所在的位置上(即不設定position時的位置,然後通過設定垂直或水平位置,讓這個元素「相對於」它的原始起點進行移動;

注意,在使用相對定位時,無論是否進行移動,元素仍然佔據原來的空間。因此,移動元素會導致它覆蓋其它框。

#box_relative

注意:position:absolute,float會隱式地改變display的型別(display:

none除外)。即是當元素設定position:absolute、float:

left、float:right中任意一個時,都會讓元素以display:inline-block的方式顯示(特點是:

可以設定長寬,預設寬度不佔滿父元素)。這時,即使故意設定display:inline; display:

block都是無效的。

但是float在ie6下的雙邊距bug就是用display:inline; 來解決的。

position:relative不會隱式改變display的型別。

7樓:林學禮

絕對定位(absolute)意思是:將被賦予此定位方法的物件從文件流中拖出,使用left,right,top, bottom等屬性相對於其最接近的一個最有定位設定的父級物件進行絕對定位,如果物件的父級沒有設定定位屬性,即還是遵循html定位規則的。

相對定位(relative)意思:物件不可層疊,依據left,right,top,bottom等屬性在正常文件流中偏移自身位置。同樣可以用z-index分層設計。

層疊樣式表(英文全稱:cascading style sheets)是一種用來表現html(標準通用標記語言的一個應用)或xml(標準通用標記語言的一個子集)等檔案樣式的計算機語言。css不僅可以靜態地修飾網頁,還可以配合各種指令碼語言動態地對網頁各元素進行格式化。

css 能夠對網頁中元素位置的排版進行畫素級精確控制,支援幾乎所有的字型字號樣式,擁有對網頁物件和模型樣式編輯的能力。

8樓:匿名使用者

div css中的絕對定位和相對定位的區別,我從網上看了好多,都沒個詳細的說法,其實也不用搞到那麼複雜的。

先說相對定位:跟它的名一樣,相對嘛,要有一個參照物,但這個參照不是別的,是它自己呢,也就是說沒設相對定位的位置,那你會問了,設沒設都在那個位置為什麼要設呢,因為只有設定了才能使 top,left這些生效,也就是設了才能相對自己原來的位置偏移,原來的位置保留著,偏移後會把其它的層遮罩住。

再說絕對定位:在佈局裡不可能有絕對定位的,再怎麼樣都有一個參照位置的,絕對定位的參照位置就不像相對那樣是自己了,至於是哪個,就看它的上級或上上級有沒有定位了,也就是有沒有position:relative;或position:

fixed了,好像position:inherit;也行,前面兩個可以,後面那個不設什麼的不用也行,最好用position:relative;吧,轉入正題,當要絕對定位的層設好要參照位置的層後,就可以用top,left這些來定位置了,如果它的上級或上上級都沒定位的話只就會根據body的位置來定位了,還有最後一點,絕對定位是不佔位置的,它會像ps的圖層一樣單獨做一層,至於第幾層你可以通過z-index:

這個屬性來設定

css樣式表中,如何將一個div標籤相對於另外一個div進行絕對定位

9樓:立青日月

有幾個方法:

一種:div1設定為position:relative,div2設定為position:absolute,此時的div2就相對於div1進行基準定位了。。。

因為絕對定位position:absolute,不在標準流中,所以內聯元素不知到他的位置,會跑到他的下面去。。。這裡就看你需要什麼樣式了,如果簡單的可以用padding和margin配合完成,讓內聯元素出來。。

但螢幕縮小放大就變形了。。

二種,就是你改寫一下你的html

把div2放到div1裡面,裡面設定為float,再position:relative進行浮動後地位,

這種方法比第一種好,這裡看你的需求了///

10樓:司馬唐遷

把div2放在div1裡,div1使用相對定位,div2使用絕對定位。

具體點的**查手冊,主要設定div2的top值和left值,自己試想要的效果。

下面的css為什麼用絕對定位?用相對定位不更好嗎?

11樓:匿名使用者

1全部使用相對定位一般是依託父級使用絕對定位而實現的,根據頁面需求與功能需求也可以單獨使用絕對定位而不是相對定位

粗略看你的**,deletediv應該是需要定位到img或者p標籤裡 而img和p沒有定位,所以deletediv使用了絕對定位

12樓:

這裡用絕對定位應該是作者考慮了當時的情況,你沒有給出和的樣式,不好直接就說相對定位更好。

從你提供的這些內容來判斷, deletediv 應該是作者想放在內部右上部位的,而在這個div之前還有img和p兩個同級別塊元素,如果用相對定位,deletediv就會受到img和p的影響。

大多數時候,用絕對定位是比較方便省事的,因為定位精確,且不容易受到同級元素的干擾。

13樓:慕刓辭

相對定位就不會是覆蓋在第一張**上了,這裡用絕對定位肯定是需要才會用到,難道你要把第一章**和deletediv和下面的span標籤一起排列?

div的相對定位和絕對定位是什麼意思,什麼區別啊?

14樓:學雅思

相對定位和絕對定位是定位的兩種表現形式,區別如下:

一、主體不同

1、相對定位:是設定為相對定位的元素框會偏移某個距離。

2、絕對定位:absolute 脫離文件流,通過 top,bottom,left,right 定位。

二、特點不同

1、相對定位:在使用相對定位時,無論是否進行移動,元素仍然佔據原來的空間。因此,移動元素會導致它覆蓋其它框。

2、絕對定位:選取其最近的父級定位元素,當父級 position 為 static 時,absolute元素將以body座標原點進行定位,可以通過z-index進行層次分級。

三、表現方式不同

1、相對定位:對一個元素進行相對定位,它將出現在它所在的位置上。可以通過設定垂直或水平位置,讓這個元素「相對於」它的起點進行移動。

2、絕對定位:文字流中的內容會頂替絕對定位元素的位置,而絕對定位元素自然的層疊於文字流之上。而在單一的絕對定位中,定位元素將會跑到網頁的左上角,因為那裡是被絕對定位後的座標原點。

15樓:匿名使用者

相對定位

這個教程應該比較清楚了

16樓:匿名使用者

絕對定位(absolute):

當一個div塊的位置被定義為絕對定位的時候,也就意味著它失去了文件流的位置,後面的文件流會緊跟著補上來接替它的位置。如果上下左右的絕對偏移量都是零,那麼它將漂浮在原來的位置上。否則就會以瀏覽器的上下左右四邊為基準進行偏移。

相對定位(relative):

當設了相對的偏移量之後,這個div原來所佔據的位置(文件流)不會被下面的div塊擠佔,而是空在那裡;當偏移後向下或者向右的內容會被隱藏,而 這一點區別於絕對定位,絕對定位會出現滾動條。但是向左或者向右的內容超出當前瀏覽器的視線,無論是相對還是覺得定位,超出的部分都會被隱藏。

區別如下:

1、相對定位不會失去文件流中的位置,而絕對定位和固定定位都會失去原來在文件流中的位置而被下面的替代;

2、無論是相對、絕對還是固定定位,當偏移量超出上面、左邊瀏覽器窗體(或者說超出可視區域)的時候,超出的內容都會被隱藏;而超出下面和右邊的時候,相對定位和固定定位會隱藏超出的部分內容,而絕對定位會出現滾動條。

3、相對、絕對和固定定位都會浮在正常文件流的上面,如果遮蓋了正常顯示的文件流,可以設定z-index來消除。

div css的絕對定位和相對定位

絕對定位 absolute 將被賦予此定位方法的物件從文件流中拖出,使用left,right,top,bottom等屬性相對於其最接近的一個最有定位設定的父級物件進行絕對定位,如果物件的父級沒有設定定位屬性,即還是遵循html定位規則的,則依據 body 物件左上角作為參考進行定位。絕對定位物件可層...

DIV CSS佈局的問題(相對和絕對定位)

阡陌半緣君 div css居然不用position?是隨便看些div css的頁面,檢視一下原始檔不就知道了?元素為relative時,如果它沒有父級,則參照body定位,子元素為absolute時,參照父級定位.所以,用得多的方法是 父元素相對,子元素絕對 寒雲 定義標籤的時候需要不需要 posi...

ecel中什麼是相對引用絕對引用和混合引用

相對引用是excel中單元格引用的方法之一,指引用的單元格的相對位置。公式中的相對單元格引用是基於包含公式和單元格引用的單元格的相對位置,如果公式所在單元格的位置改變,引用也隨之改變。絕對引用是指在excel中建立公式時,單元格中的絕對單元格引用總是在指定位置引用單元格。如果公式所在單元格的位置改變...