css样式鼠标经过插入一个伪元素

直接上代码

.div {
 width:100px;
 height:100px;
 position:relative;/*子绝父相*/
}


.div:hover::before {
 content:"";
 width:100%;
 height:100%;
 border:10px solid rgba(255,255,255,.3);
 display:block;/*伪元素属于行内元素，需要转换*/
 position:absolute;
 top:0;
 left:0;
 box-sizing:border-box;/*把padding 和 border 都算入width里面*/
}