在菜鳥教程的CSS教程中有這樣一句話
絕對定位的元素的位置相對於最近的已定位父元素，如果元素沒有已定位的父元素，那么它的位置相對於<html>
我也一直以這句話作為絕對定位的標准，直到今天，在偶然發現，祖先元素均未定位的絕對定位元素，無論是定位還是寬高相對於的不是,而是瀏覽器的窗口即viewport。
demo：
<!DOCTYPE html>
<head>
<title>Document</title>
</head>
<style>
html {
min-width: 1200px;
}
.box {
position: absolute;
right: 0;
top: 0;
width: 50%;
height: 100px;
background-color: yellow;
}
</style>
<body>
<div class="box"></div>
</body>
</html>
在給設置了寬度之后，box的寬度和定位始終相對於瀏覽器窗口大小，並非html。
后來查閱MDN文檔，發現菜鳥教程的定義並不准確，在MDN中是這樣寫的：
絕對定位元素相對於最近的非 static 祖先元素定位。當這樣的祖先元素不存在時，則相對於ICB（inital container block, 初始包含塊）。
初始包含塊：
- 根元素的包含塊是一個矩形,叫做初始化包含塊;
- 對於 【連續媒體】就是,初始化包含塊的 尺寸等於viewport的尺寸,起點是canvas的原點;
- 初始化包含塊的方向(direction)等同於根元素的方向;
- 初始化包含塊不是viewport,只是尺寸一樣;
總結：若絕對定位元素不存在非 static 定位的祖先元素，則元素相對於初始包含塊定位並非<html>，而初始包含塊的尺寸與方向與viewport相同。