CSS3 信封形状

Question

您可能已经猜到，这张图片是邮件信封形状的一部分，如果可能的话，我想用 CSS3 创建它。我已经制作了其他部分，但是这个很棘手。该形状需要在两侧和圆 Angular 处进行三 Angular 形切割(大概是 border-radius-bottom-left/border-radius-bottom-right)。它还必须具有转换小阴影的能力。

这是我到目前为止所做的 -

#envelope {
background: #fff;
}

.closed {
width: 860px;
height: 0; 
border-top: 80px solid fff;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
-moz-box-shadow: 0 1px 5px #ccc;
-webkit-box-shadow: 0 1px 5px #ccc;
box-shadow: 0 1px 5px #ccc;
}

jsFiddle - http://jsfiddle.net/hsYUy/

Answer 1

这是我的尝试，只有一个 div

div {
    margin:20px;
    width:500px;
    height:60px;
    border-bottom-left-radius: 90px 200px;
    border-bottom-right-radius: 90px 200px;
    box-shadow: 0 5px 3px -5px #888,
    5px 0 3px -5px #888,
    -5px 0 3px -5px #888;    
}

<div></div>

http://jsfiddle.net/Simo990/Z8cPc/4