css样式

&-triangle {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 0;
  border-top: 60rpx solid transparent;
  border-right: 376rpx solid #f5f7fa;
  border-bottom: 60rpx solid #f5f7fa;
  border-left: 376rpx solid transparent;
}
实现效果
![在这里插入图片描述](https://img-blog.csdnimg.cn/20191121170747696.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2FhYWFhYWJhYWFhYWI=,size_16,color_FFFFFF,t_70)
颜色从上到下渐变
background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.4) 100%);