SOURCE

<div class="rel">
    <div class="clickbtn">
    </div>
</div>

.clickbtn{
    position: relative;
    width: 120px;
    height: 50px;
    
    color: #fff;
    text-align: center;
    cursor: pointer;
}
.clickbtn:before{
    content: "领取";
    line-height: 50px;
    position: absolute;
    left: 0;
    top: 0;
    right:0;
    bottom: 0;
    background: #06f;
    size: #fff;
    border: 1px solid #fff;
    border-radius: 10px;  
}
.clickbtn:hover:before{
    content: '等待领取';
       background: #fff;
    color: #06f;
    border: 1px solid #06f;
    border-radius: 10px;  
}
.clickbtn:active:before{
 
    content: '已经领取';
    border-radius: 10px;
    color: #666666;
     border: 1px solid #999999;
    background-color: #999999;  
}