css+div实现倒三角

经常遇到类似信息框，需要一个倒三角，本文是纯css实现方式

主要代码如下：

.css{
      width: 0px;
      height: 0px;
      border: 10px solid #FFFFFF;
      border-right-color: transparent;
      border-bottom-color: transparent;
      border-left-color: transparent;
      transform: scale(1, 2);
}

主要原理，width和height设置成0；然后设置边框，只展示上边框，会呈现一个正三角形。

然后如果需要拉伸比例，可设置transform，根据需要拉伸x或者y方向