梯形：
由此可见，css绘制的梯形并不是一个容器，只是容器的一条边。css把容器的其余三条边设置为透明的，只显示需要的一条边，就是一个梯形了。
直角梯形
三角形
盒子模型分为两种，一种是border-box，一种是center-box。低版本的ie中是border-box,在新的浏览器中，我们可以把容器的宽高设计为0或者特地设置box-sizing: border-box。
来看看border-box的效果：
由此可见，当设置为border-box时，border的大小包含在容器大小之内,我们可以通过显示某条边来制作三角形
border-box画直角三角形
center-box:
与border-box一样，可以根据控制border的width和方向来画出自己想要的三角形
用CSS+DIV做那就太简单了，用div，span，ul，table都可以完成。用JS做是这样的，这段代码加入head标签中即可。
<script type="text/javascript">
document.write("<table>")
for (var i =1i<=9i++)
{
document.write("<tr>")
for (var j =1j<=ij++)
{
document.write("<td style='border:1px solid #333333'>")
document.write(j+"*"+i+"="+i*j)
document.write("</td>")
}
document.write("</tr>")
}
document.write("</table>")
</script>
这就是一个梯形<div style="width:200pxheight:0border-bottom: 100px solid pinkborder-top:0border-right: 100px solid transparentborder-left: 100px solid transparent"></div>
