當(dāng)前位置:
首頁 >
CSS z-index 属性
發(fā)布時間:2025/3/16
38
豆豆
生活随笔
收集整理的這篇文章主要介紹了
CSS z-index 属性
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
定義和用法
z-index 屬性設(shè)置元素的堆疊順序。擁有更高堆疊順序的元素總是會處于堆疊順序較低的元素的前面。
注釋:元素可擁有負(fù)的 z-index 屬性值。
注釋:Z-index 僅能在定位元素上奏效(例如 position:absolute;)!
說明
該屬性設(shè)置一個定位元素沿 z 軸的位置,z 軸定義為垂直延伸到顯示區(qū)的軸。如果為正數(shù),則離用戶更近,為負(fù)數(shù)則表示離用戶更遠(yuǎn)。
用法:Z-index 可用于將在一個元素放置于另一元素之后
<html> <head> <style type="text/css"> img.x { position:absolute; left:0px; top:0px; z-index:-1 } </style> </head><body> <h1>這是一個標(biāo)題</h1> <img class="x" src="../i/eg_mouse.jpg" tppabs="http://www.w3school.com.cn/i/eg_mouse.jpg" /> <p>默認(rèn)的 z-index 是 0。Z-index -1 擁有更低的優(yōu)先級。</p> </body></html>
<span style="font-size:18px;"><html> <head> <style type="text/css"> img.x { position:absolute; left:0px; top:0px; z-index:1 } </style> </head><body> <h1>這是一個標(biāo)題</h1> <img class="x" src="../i/eg_mouse.jpg" tppabs="http://www.w3school.com.cn/i/eg_mouse.jpg" /> <p>默認(rèn)的 z-index 是 0。Z-index 1 擁有更高的優(yōu)先級。</p> </body></html></span>
與50位技術(shù)專家面對面20年技術(shù)見證,附贈技術(shù)全景圖
總結(jié)
以上是生活随笔為你收集整理的CSS z-index 属性的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 这两天有点热吆,star直线上涨!~Je
- 下一篇: CSS之transition, tran