相关疑难解决方法(0)

当您使用Mobile Safari 转到http://m.google.com页面时,您会在页面顶部看到漂亮的栏.

我想画一些梯形(美国:梯形),但我不知道如何.我应该使用css3三维变换吗？如果你有一个很好的方法来实现它,请告诉我.

您可能已经猜到这个图像是邮件信封形状的一部分,如果可能的话我想用CSS3创建.我做了其他部分,但这个很棘手.形状需要两侧的三角形切口和圆角(可能是边界半径 - 左下角/边缘半径 - 右下角).它也必须有蒙上了小影的能力.

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

#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/

我对css有点小问题.我需要一个梯形div,其左上角(角度大于90度的那个)是圆形的.我已经知道了这个:

HTML:

<div style="margin:30px">
  <div class="trapezoid">
  </div>
</div>

CSS:

.trapezoid{
  vertical-align: middle;
  border-bottom: 31px solid red;
  border-left: 25px solid transparent;
  height: 0;
  width: 150px;
}

产生一个梯形.我尝试了这个border-top-left-radius属性,但效果还不够.

这里有一个jsfiddle上面的代码,好吧,摆弄:http://jsfiddle.net/n3TLP/5/

我需要更多信息才能评论.
提前致谢 :)