纯css关闭按钮 [英] Pure css close button

问题描述

  a.boxclose {
 float：right; 
 margin-top：-30px; 
 margin-right：-30px; 
 cursor：pointer; 
 color：#fff; 
 border：1px solid #AEAEAE; 
 border-radius：30px; 
 background：＃605F61; 
 font-size：31px; 
 font-weight：bold; 
 display：inline-block; 
 line-height：0px; 
 padding：11px 3px; 
} 
 
 .boxclose：before {
 content：×; 
} 
  

JSFiddle

Is there any way to make something like the X on that link with pure css?

解决方案

I spent more time on this than I should have, and haven't tested in IE for obvious reasons. That being said, it's pretty much identical.

http://jsfiddle.net/adzFe/14/

a.boxclose{
    float:right;
    margin-top:-30px;
    margin-right:-30px;
    cursor:pointer;
    color: #fff;
    border: 1px solid #AEAEAE;
    border-radius: 30px;
    background: #605F61;
    font-size: 31px;
    font-weight: bold;
    display: inline-block;
    line-height: 0px;
    padding: 11px 3px;       
}

.boxclose:before {
    content: "×";
}

这篇关于纯css关闭按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！