body{
background:#000;
}
.wrap{
widows: 840px;
margin:50px auto;
height:300px;
}
.wrap a {
float:left;
width: 180px;
height:180px;
margin:10px;
border:2px solid #ccc;
position: relative;
}
.wrap a .top{
display:inline-block;
position: absolute;
left:-2px;
top:-2px;
width: 0px;
height:2px;
background:#ff0000;
transition:.5s;
}
.wrap a .right{
display:inline-block;
position: absolute;
right:-2px;
bottom:0;
width: 2px;
height:0;
background:#ff0000;
transition:.5s;
}
.wrap a .bottom{
display:inline-block;
position: absolute;
right:-2px;
bottom:-2px;
width: 0;
height:2px;
background:#ff0000;
transition:.5s;
}
.wrap a .left{
display:inline-block;
position: absolute;
left:-2px;
top:0;
width: 2px;
height:0;
background:#ff0000;
transition:.5s;
}
.wrap a:hover .top,.wrap a:hover .bottom{
width:102%;
transition: .5s;
}
.wrap a:hover .right, .wrap a:hover .left{
height:101%;
transition: .5s
}
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
