其他分享
首页 > 其他分享> > html的z-index

html的z-index

作者:互联网

vscode编辑 <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta http-equiv="X-UA-Compatible" content="IE=edge">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>Document</title>     <style>         .shadow{             position: fixed;             top: 0;             bottom: 0;             left: 0;             right: 0;             background-color:rgba(0,0,0,0.5);             z-index: 80;         }         .mode{             position: fixed;             height: 400px;             width: 400px;             background-color: white;             z-index: 100; /*数值越大,越在上层显示*/             left: 50%; /*按照窗口宽度的50%来移动*/             top: 50%; /*按照窗口高度的50%来移动*/             margin-top: -200px;              margin-left: -200px;/*正的相当于距离左边200px,负号相当于右边了 */                      }     </style> </head> <body>     <div>         <h1>             我在测试         </h1>     </div>          <div class="mode"></div>     <div class="shadow"></div> </body> </html>

标签:index,top,50%,html,400px,200px,left
来源: https://www.cnblogs.com/jtyzy/p/15202662.html