1.CSS图像绘制之：关闭按钮

一、HTML

<span class="close">Close Me</span>

二、CSS

/*使页面背景显示为绿色*/
body {
   background:#2ECC71;    margin:50px;
}
.close{
   font-size:0px;
   display:block;
}
/*绘制上下2个白色长方形*/
.close::before, .close::after{
   content:'';
   width:50px;
   height:2px;
   background:#FFF;
   display:block;
}

/*上个长方形顺时针旋转45°*/
.close::before{
   transform: rotate(45deg);
}

/*下个长方形逆时针旋转45°*/
.close::after{
   transform:translateY(-2px) rotate(-45deg);
}