CSS 生成关闭叉叉图标
.
<span id="closebtn" class="closebtn"></span>
.closebtn{
width: 25px;
height: 25px;
display: inline-block;
cursor: pointer;
position: absolute;
top: 15px;
right: 15px;
}
.closebtn::before, .closebtn::after {
content: '';
position: absolute;
height: 2px;
width: 20px;
top: 12px;
right: 2px;
background: #999;
cursor: pointer;
}
.closebtn::before {
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}
.closebtn::after {
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
}