css斜角覆盖阴影

 

Demo下载  效果如图：

css：

    #box {
        width: 280px;
        height: 150px;
        background: #ff6565;
        padding: 20px;
        position: relative;
        overflow: hidden;
    }
    #content {
        width: 280px;
        height: 150px;
        background: #ffe765;
    }
    #shadow {
        width: 63px;
        height: 63px;
        position: absolute;
        transform: rotate(-45deg);
        top: -20px;
        left: -20px;
        background: url(shadow.png) no-repeat center bottom;
    }
    #shadow div {
        width: 63px;
        height: 60px;
        background: #ff6565;
    }

html：

    <div id="box">
        <div id="shadow"><div></div></div>
        <div id="content"></div>
    </div>