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

角形、圆形（圆角程度）"/>

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%;}