】把元素的position屬性設定為relative、absolute或fixed後，繼而可以使用trbl屬性，相對於另乙個元素移動該元素的位置。這裡的「另乙個元素」，就是該元素的定位上下文。
絕對定位元素的預設上下文是body。然而絕對定位元素的任何祖先元素都可以成為它的定位上下文，只要把相應的祖先元素的position設定為relative即可。
<body
>
<
div
id="outer"
>
<
div
id="inner"
>這是乙個測試文件，測試定位上下文，定位屬性和屬性操作
div>
div>
body
>
div#outer顯示結果如圖：div#inner
**裡給內部div設定了top和left屬性，但是內部div並沒有相對外部div向下移動10畫素，向右移動20畫素。原因在於內外部div預設都是靜態定位，它們之間不存在誰是誰的定位上下文這個問題。換句話說，在常規文件流中，由於外部div沒有內容，內部div就會跟它共享相同的起點。只有將position屬性設定為relative、absolute或fixed，這個元素的trbl屬性才會起作用。
這時給內部設定為絕對定位：
div#outerdiv#inner這時效果如圖
由於沒有相對定位的祖先元素供其參照，內部div只能以預設的定位上下文body作為參照，相對於它定位。此時，內部div完全無視其父元素的存在，tl屬性會相對於body元素向下、向左偏移其位置。
這時如果把外部div的position屬性設定為relative。
div#outerdiv#inner絕對定位的上下文就變成了外部div，這時效果如下圖所示：
CSS層疊上下文
以下幾種方式可以建立層疊上下文 包括但不限於哈 對有定位的元素 即postion不是預設的static 設定 z index值 將 opacity 設定成比1小的值 將 position 設定成 fixed 或者 sticky 不需要再設定 z index 不使用 normal 而是使用 mix b...
程序上下文和中斷上下文 原子上下文的區別
核心空間和使用者空間是現代作業系統的兩種工作模式，核心模組執行在核心空間，而 使用者態應用程式執行在使用者空間。它們代表不同的級別，而對系統資源具有不同的訪問許可權。核心模組執行在最高端別 核心態 這個級下所有的操作都受系統信 任，而應用程式執行在較低級別 使用者態 在這個級別，處理器控制著對硬體的...
程序上下文和中斷上下文的區別
核心空間和使用者空間是現代作業系統的兩種工作模式，核心模組執行在核心空間，而使用者態應用程式執行在使用者空間。它們代表不同的級別，而對系統資源具有不同的訪問許可權。核心模組執行在最高端別 核心態 這個級下所有的操作都受系統信任，而應用程式執行在較低級別 使用者態 在這個級別，處理器控制著對硬體的直接...