我想在 html 中制作一个具有截止角并在形状周围有边框的形状。
我可以制作没有边框的截断形状,如下所示:
html:
<div class="cut-off"></div>
CSS:
.cut-off{
position:relative;
top:400px;
left:400px;
height:155px;
width:200px;
background:red;
}
.cut-off:after{
position:absolute;
bottom:0px; right:-20px;
content:".";
text-indent:-999px; overflow:hidden;
display:block;
width:0px; height:0px;
border-top: 20px solid green;
border-right: 20px solid transparent;
}
.cut-off:before{
position:absolute;
top:0; right:-20px;
content:"#";
text-indent:-999px; overflow:hidden;
display:block;
background:blue;
width:20px; height:135px;
}
现在我想要一个围绕形状的边框。我该怎么做?
我想要一个像这样的形状:
充满了颜色。