CSS3制作标准几何图形能让画面效果得到很大提升，也不像图片一样影响加载时间，因此适合多数追求极简WEB设计。

HTML部分

<div class="tixing"></div>
<div class="tixingxia"></div>

CSS部分

<style type="css/txt">
.tixing{border-bottom:30px solid #ccc;border-left:100px solid transparent;border-right:100px solid transparent;width:100%;} 
.tixingxia{width:100%;height:10px;background:#ddd;}
</style>

完整例子

由于背景是白色的，用两个色块就能做出半透明的玻璃效果，图片还可以增加阴影样式，效果更好，比如：

<style type="css/txt">
.tixing{margin-top:-60px;border-bottom:30px solid #ccc;border-left:100px solid transparent;border-right:100px solid transparent;width:100%;} 
.tixingxia{width:100%;height:10px;background:#ddd;}
.img{width:100%;height:auto;box-shadow: 0 10px 10px #a18e8e;}
</style>
<div class="case">
 <img src="1.jpg"/>
 <div class="tixing"></div>
 <div class="tixingxia"></div>
</div>