css 绘制三角形

css 实现上右下左三角

右三角

border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
border-right: 6px solid transparent;
border-left: 8px solid #d0d0f1;

左三角

border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
border-left: 6px solid transparent;
border-right: 8px solid #d0d0f1;

下三角

border-bottom: 6px solid transparent;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-top: 8px solid #d0d0f1;

上三角

border-top: 6px solid transparent;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-bottom: 8px solid #d0d0f1;