資訊專欄INFORMATION COLUMN
摘要：脫離文檔流首先設(shè)置絕對(duì)定位后，會(huì)脫離文檔流，因此不占據(jù)空間。相對(duì)于誰定位相對(duì)于它在普通文檔流中的位置。脫離文檔流后可以做什么絕對(duì)定位的框與文檔流無關(guān)，所以它們可以覆蓋頁(yè)面上的其它元素。
脫離文檔流？
首先div設(shè)置absoluted絕對(duì)定位后，div會(huì)脫離文檔流，因此不占據(jù)空間。
與div設(shè)置為relative相對(duì)定位不同，相對(duì)定位實(shí)際上被看作普通流定位模型的一部分。
絕對(duì)定位的元素的位置相對(duì)于最近的已定位祖先元素，如果元素沒有已定位的祖先元素，那么它的位置相對(duì)于最初的包含塊。根據(jù)用戶代理的不同，最初的包含塊可能是畫布或 HTML 元素。
relative相對(duì)于誰定位？相對(duì)于它在普通文檔流中的位置。
脫離文檔流后可以做什么？絕對(duì)定位的框與文檔流無關(guān)，所以它們可以覆蓋頁(yè)面上的其它元素。可以通過設(shè)置 z-index 屬性來控制這些框的堆放次序。
相對(duì)于div最近的（非static定位的）父級(jí)元素的borderbox進(jìn)行定位。主要代碼如下：
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://specialneedsforspecialkids.com/yun/54637.html
摘要：總結(jié)一下定位相對(duì)于誰進(jìn)行定位有點(diǎn)復(fù)雜就是找出定位元素父元素鏈上的所有父元素，由近到遠(yuǎn)哪個(gè)元素不是默認(rèn)定位即定位的，那么就相對(duì)于它進(jìn)行定位。當(dāng)父元素鏈上所有父元素都是默認(rèn)定位，那么定位就是相對(duì)于元素的，效果和定位差不多。 相信學(xué)過CSS的同學(xué)都曾經(jīng)對(duì)于position的各種屬性很困惑，尤其是absolute和relative定位，簡(jiǎn)直就是傻傻分不清，筆者寫這篇文章就是希望通過代碼實(shí)驗(yàn)的方...
摘要：在使用相對(duì)定位時(shí)，無論元素是否進(jìn)行移動(dòng)，元素依然占據(jù)原來的空間。放置絕對(duì)定位對(duì)象在可視區(qū)域之外會(huì)導(dǎo)致滾動(dòng)條出現(xiàn)。相對(duì)定位是相對(duì)于元素在文檔流中初始位置的，而絕對(duì)定位是相對(duì)于最近的已經(jīng)定位的祖先元素。 CSS2.0 HandBook上的解釋： 設(shè)置此屬性值為 absolute 會(huì)將對(duì)象拖離出正常的文檔流絕對(duì)定位而不考慮它周圍內(nèi)容的布局。假如其他具有不同 z-index 屬性的對(duì)象已經(jīng)占...
摘要：和不同，其他三個(gè)元素的位置重新排列了。只要元素會(huì)脫離文檔結(jié)構(gòu)，它就會(huì)產(chǎn)生破壞性，導(dǎo)致父元素坍塌。的絕對(duì)定位元素的定位永遠(yuǎn)是相對(duì)于瀏覽器邊界的，和其他元素沒有關(guān)系。 1.引言 在學(xué)習(xí)position之前，我們應(yīng)該去思考一個(gè)問題：什么情況下我們需要定位？如果沒有定位將無法滿足我們?cè)鯓拥男枨螅课覀円溃蝗祟悇?chuàng)造出來的每一個(gè)知識(shí)，都有它的用途，都要解決一些之前遇到的問題。 如果沒有定位，我...
摘要：當(dāng)一個(gè)盒根據(jù)常規(guī)流或者浮動(dòng)擺放好后，它可能會(huì)相對(duì)于該位置移動(dòng)，這叫相對(duì)定位。 當(dāng)一個(gè)盒根據(jù)常規(guī)流或者浮動(dòng)擺放好后，它可能會(huì)相對(duì)于該位置移動(dòng)，這叫相對(duì)定位。 相對(duì)定位的盒保持它在常規(guī)流中的大小，包括換行和空格都會(huì)原樣保留 relative與absolute,fixed relative與absolute的關(guān)系 在例1中,absolute元素的top/left:0的定位在瀏覽器窗口的左...
摘要：讓元素脫離文檔流有三種方法浮動(dòng)絕對(duì)定位固定定位元素脫離文檔流定位的三種布局機(jī)制文檔流浮動(dòng)定位。定位元素會(huì)脫離文檔流。浮動(dòng)的元素是先站住自己所在文檔流的位置，然后左右浮動(dòng)。 文檔流 文檔流是一種默認(rèn)定位方式，在文檔流中元素框的位置由元素在html中的位置決定，文檔流中元素的position屬性為默認(rèn)的static或繼承來的static并按照普通流定位。塊級(jí)元素獨(dú)占一行，自上而下排列；內(nèi)聯(lián)...
摘要：有三種情況將使得元素脫離文檔流而存在，分別是浮動(dòng)，絕對(duì)定位，固定定位。我的回答是相對(duì)自己文檔流中的原始位置定位。這里就不解釋脫離文檔流的問題，主要研究它的定位問題。 一 前言 CSS定位是CSS布局只能夠重要的一環(huán)。本篇文章帶你解讀定位屬性，可以讓你更加深入的理解定位帶來的一些特性，熟練使用CSS布局。 二 正文 1.文檔流布局的概念 將窗體自上而下分成一行行， 并在每行中按從左至右的...
閱讀 2142·2021-10-12 10:11
閱讀 843·2021-10-09 09:41
閱讀 3757·2021-09-09 11:37
閱讀 1933·2021-09-08 10:41
閱讀 2633·2019-08-30 12:58
閱讀 2369·2019-08-30 10:58
閱讀 1272·2019-08-26 13:40
閱讀 4097·2019-08-26 13:36
