zoukankan      html  css  js  c++  java
  • box-shadow 被其他div遮住 shadow was hidden/covered by another div

    使用z-index 来处理 (z-index必须在使用了position的情况下才有效)

    参考http://stackoverflow.com/questions/5505118/css-box-shadow-hidden-z-index-does-not-fix

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Insert title here</title>
    <style type="text/css">
    .borderbox {
        -moz-background-clip: border;
        -webkit-background-clip: border-box;
        -o-background-clip: border-box;
        background-clip: border-box;
    }
    
    .div1 {
        position: relative;
        z-index: 2;
        height: 100px;
        width: 100px;
        background-color: yellow;
        box-shadow: 2px 2px 5px #D9D9D9;
    }
    
    .div2 {
        position: relative;
        z-index: 1;    
        height: 100px;
        width: 100px;
        background-color: #E4FDFC;
    }
    </style>
    </head>
    <body>
        <div class="div1"></div>
        <div class="div2"></div>
    </body>
    </html>
  • 相关阅读:
    软件工程个人作业01
    动手动脑
    大道至简感想终结篇
    课后作业
    反思
    课后作业
    不忘初心,方得始终
    课后作业
    沟通,让一切变得简单

  • 原文地址:https://www.cnblogs.com/cart55free99/p/3552249.html
Copyright © 2011-2022 走看看