z-index 定义为其他值后为 auto

Question

我有这两个 div，并且打算将“a”保持在 z-index 设置的“b”上方，但它不起作用，并且日志显示两个 z-index 都是自动的。为什么？

<div id="a" style="z-index=2; position:fixed; width:100%; height:40px; background:green;">

</div>

<div id="b" style="z-index=1; position: relative; width:100%; top:20px; height:100px; background:gray; left:40px;">

</div> 

<script>

console.log("a",window.getComputedStyle(document.getElementById("a")).zIndex);

console.log("b",window.getComputedStyle(document.getElementById("b")).zIndex);

</script>

如果通过 javascript 设置它可以工作：

document.getElementById("a").style.zIndex=2;

但是 z-index set inline 不起作用，为什么？

Answer 1

你有错字。z-index=1应该变成z-index:1