根据项目需求,用css做了一个如下图所示的CRM三角形条幅,简单说就是三角形背景色块,加一个倾斜缩放的CRM字体;
代码如下:
<div class="triangle-topleft">
<span class="font-CRM">CRM</span>
</div>
.triangle-topleft {
width: 0;
height: 0;
border-top: 32px solid #ebf2f9;
border-right: 32px solid transparent;
position: relative;
}
.font-CRM {
color: #1182e0;
position: absolute;
top: -40px;
left: -3px;
transform: scale(0.7) rotate(
-45deg
);
font-size: 12px;
font-weight: bold;
}