As shown above: to achieve such a corner of the corner cut off.
The idea is: first with a similar background of an area covered with the angle, and then draw a line, then at the notch.
css code:
.bian{
height:200px;
width:500px;
position:relative;
border:2px solid #6ca2f6;
background: rgba(38, 46, 78, 0.6);
}
.shape-left-bottom{
position: absolute;
bottom: 8px;
left: -12px;
z-index: 99;
width: 0;
height: 0;
border-color: transparent transparent transparent #fff;
border-style: solid;
border-width: 0 20px 20px;
transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
-webkit-transform: rotate(-90deg);
}
.shape-left-bottom:before{
position: absolute;
content: '';
display: inline-block;
left: -23px;
bottom: -11px;
height: 2px;
width: 27px;
border-bottom: 2px solid #6ca2f6;
transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
}
html:
<div class="bian"> <div class="shape-left-bottom"></div> </div>