css实现梯形？

HTML:

<div class="box"></div>

CSS:

.box{
    width:50px;
    height:0;
    border-bottom:50px solid pink;
    border-left:50px solid #fff;
    border-right:50px solid #fff;
}

效果：