css z-index 屬性用于設置元素的堆疊順序；擁有更高堆疊順序的元素總是會處于堆疊順序較低的元素的前面。該屬性僅能在定位元素上奏效(例如：position:absolute, position:relative, or position:fixed)。

css z-index屬性怎么用？

z-index 屬性設置元素的堆疊順序。擁有更高堆疊順序的元素總是會處于堆疊順序較低的元素的前面。

語法：z-index : auto | number;

參數：

auto：默認。堆疊順序與父元素相等。

number：數值，設置元素的堆疊順序；可以是正值，也可以是負值。

說明：該屬性設置一個定位元素沿 z 軸的位置，z 軸定義為垂直延伸到顯示區的軸。如果為正數，則離用戶更近，為負數則表示離用戶更遠。

注釋：所有主流瀏覽器都支持 z-index 屬性。任何的版本的 Internet Explorer (包括 IE8)都不支持屬性值 "inherit"。元素可擁有負的 z-index 屬性值。Z-index 僅能在定位元素上奏效(例如：position:absolute, position:relative, or position:fixed)！

css z-index屬性 示例

img {

position: absolute;

left: 0px;

top: 0px;

z-index: -1;

}

h2,p{

background-color: white;

border: 1px solid red;

}

This is a heading

由于圖像的 z-index 是 -1，因此它在文本的后面出現。

效果圖：

與50位技術專家面對面20年技術見證，附贈技術全景圖

總結

以上是生活随笔為你收集整理的html怎么设置z值,css z-index属性怎么用的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。