CSS中z-index:0 与 z-index:auto的区别

it2025-05-03  3

z-index:0 与 z-index:auto的区别

区别:

z-index: 0 会创建一个新的层叠上下文 z-index: auto 不会去创建z-index: 0 会在 z-index: 上面

代码演示:

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style> .red,.blue{ width: 200px; height:200px;} .red { position: absolute; z-index: 0; top: 100px; left: 100px;; background: #FF0000; } .blue { position: absolute; z-index: auto; top: 40px; left: 40px;; background: #0000FF; } </style> </head> <body> <div class="blue">index-auto</div> <div class="red">index-0</div> </body> </html>

接着运行代码:

作者:xgqzero自制*

最新回复(0)