四行代码实现css三角形

实现原理:

1.给盒子设置宽高为 0

2.给盒子加边框,并且边框颜色为透明 边框越宽三角形越大

3.想要三角形在那边就给哪边设置边框颜色

上代码:

<style>
div {
  width: 0;
  height: 0;
  border: 20px solid transparent;
  border-bottom-color: red;
}
 </style>

效果