位置：絕對/固定將顯示屬性更改爲阻止

Question

今天我在工作中遇到了一個有趣的問題。 當我使用絕對或固定位置設置內聯元素時，它的行爲類似於可以具有高度和高度的塊元素。 這裏一個簡單的例子：

span { 
 
    background: red; 
 
    height: 100px; 
 
    width: 100px; 
 
} 
 

 
span#absolute { 
 
    position: absolute; 
 
    top:30px; 
 
    left:30px; 
 
}

<span>Inline</span> 
 

 
<span id="absolute">Inline, too</span>

正如你可以看到這兩個範圍有height和width（應在直列elemens被忽略）。但是在使用posision:absolute時適用。

所以我的問題：是第二個span行爲像display:block完全或只是一個半塊行爲？

Answer 1

http://www.w3.org/TR/CSS21/visuren.html#dis-pos-flo：

影響框生成和佈局的三個屬性 - '顯示器'， '位置' 和 '浮動' - 相互作用如下：
2. [...]如果「位置'具有'絕對'或'固定'的值，該框絕對定位，'浮動'的計算值爲'無'，並根據下表設置顯示。

而且在下面提到表，你看到的規定值inline（其中span具有通過用戶代理樣式表默認值），計算值是... block

Answer 2

根據Chrome瀏覽器在span＃絕對值上的計算樣式，該元素具有display：block屬性。