css z index屬性怎麼用

2022-10-09 14:18:09 字數 663 閱讀 3656

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屬性 示例

由於影象的 z-index 是 -1,因此它在文字的後面出現。

效果圖:

css z index屬性怎麼用?

css z index 屬性用於設定元素的堆疊順序 擁有更高堆疊順序的元素總是會處於堆疊順序較低的元素的前面。該屬性僅能在定位元素上奏效 例如 position absolute,position relative,or position fixed css z index屬性怎麼用?z index...

CSS z index 屬性詳解

z index 屬性設定元素的堆疊順序。擁有更高堆疊順序的元素總是會處於堆疊順序較低的元素的前面。該屬性設定乙個定位元素沿 z 軸的位置,z 軸定義為垂直延伸到顯示區的軸。z index 屬性值可以是負的,如果為正數,則離使用者更近,為負數則表示離使用者更遠。z index 僅能在定位元素上奏效 p...

深入 css z index 屬性

說來汗顏,一直以來對於 css 常常是不求勝解。直到自己需要打造自己的輪子才發現對z index完全不熟悉。關於z index的問題其實非常少人完全明白它到底是怎麼運作的。事實上這並不複雜,不過如果你不曾花些時間閱讀規範可能你不曾察覺一些重要的觀念。在下面的 html 中我們有三個元素,每乙個元素包...