html代码
正常效果
点击效果
<a class="btn-v2 short-full-screen-v2 btn-none-v2" href="#"><i class="icon-short-full-screen" style="margin-left: 5px;"></i>全屏</a>css代码
字体相应效果
.btn-v2:hover,.btn-v2:active,.btn-v2:focus{background-color: #369327;text-decoration: none;border: 1px solid #369327;}
.short-full-screen-v2{color:#666666;padding-right: 8px;padding-left: 0px;}
.btn-none-v2{background-color:#ffffff;border-color: #DCDCDC;color: #666666;padding:5px 10px;} .btn-none-v2:hover{background-color:#02B300;color: #ffffff;text-decoration: none;border: 1px solid #02B300;} .btn-none-v2:focus{background-color:#02B300;color: #ffffff;text-decoration: none;border: 1px solid #02B300;}
图片相应效果
.btn-v2 .icon-short-full-screen{background-position: -360px -654px;padding:1px 6px;} .btn-v2:hover .icon-short-full-screen{background-position: -360px -725px;} .btn-v2:focus .icon-short-full-screen{background-position: -360px -725px;}