效果上图所示,通过使用伪类::after 和 ::before实现角边框
.custom-box-cont {
width: 100%;
background: rgba(3,23,45,0.3);
position: relative;
padding: 20px;
&::after {
content: "";
position: absolute;
width: 10px;
height: 10px;
box-sizing: border-box;
border: 2px solid #005ED6;
bottom: 0;
left: 0;
border-top: none;
border-right: none;
}
&::before {
content: "";
position: absolute;
width: 10px;
height: 10px;
box-sizing: border-box;
border: 2px solid #005ED6;
bottom: 0;
right: 0;
border-left: none;
border-top: none;
}
}