先看效果图
HTML代码(注:view是微信小程序中的div,如果是html或者vue换成div即可):
CSS代码:
.a {
width: 10px;
height: 10px;
position: absolute;
top: 0;
left: 0;
border-left: 2px solid #EBEBEB;
border-top: 2px solid #EBEBEB;
}
.b {
width: 10px;
height: 10px;
position: absolute;
top: 0;
right: 0;
border-right: 2px solid #EBEBEB;
border-top: 2px solid #EBEBEB;
}
.c {
width: 10px;
height: 10px;
position: absolute;
bottom: 0;
left: 0;
border-bottom: 2px solid #EBEBEB;
border-left: 2px solid #EBEBEB;
}
.d {
width: 10px;
height: 10px;
position: absolute;
bottom: 0;
right: 0;
border-right: 2px solid #EBEBEB;
border-bottom: 2px solid #EBEBEB;
}
即可实现效果。
标签:right,solid,2px,边框,10px,div,border,css,EBEBEB
来源: https://blog.csdn.net/qq_43358160/article/details/114580148