html三角形、圆形（圆角程度）

三角形

方法：
（1）初始创建一个宽高为100的正方形，并设置1像素的实心边框
（2）增大边框的宽度到50像素，即看到四个边框会相互挤压变为梯形
（3）此时将该正方形的宽高重置为0。即可看到图一效果。
（4）四个三角形需要哪个方向的三角形，更改其他方向的border-color值为:transparent即可。

div {
        width: 0px;
        height:0px;
        border: 50px solid;
        border-color: red yellow pink blue;
    }

border-radius 圆角程度

说明：使宽高为100像素的正方形的四个边角圆润程度增加
当border-radius的值达到50%时即为一个圆形。

div {
        width: 100px;
        height:100px;
        background-color: grey;
        border-radius: 10%;
        margin:0 50%;
    }