纯css利用伪类实现类似于ElementUI中复选框选中时的状态样式

效果图：

直接看下面代码，简单易懂：

<div class="choseMask"></div> .choseMask { position: absolute; top: 0; right: 0; width: 16px; height: 16px; background-color: #409eff; z-index: 12; } .choseMask::after { width: 3px; height: 8px; box-sizing: content-box; content: ""; border: 1px solid #fff; border-left: 0; border-top: 0; position: absolute; top: 3px; left: 6px; transform: rotate(45deg) scaleY(1); }

图标样式大小可根据自己需求进行调整，修改上面的大小及定位距离即可。