Tạo Button Download Với CSS Hover Tuyệt Đẹp Cho Blogspot

Đăng Ngày: 11:10:00

Đức Vũ

Xin chào các bạn tới Tiến Đức Blog, hôm nay rảnh lướt Blog bạn thấy nút Button Download hiệu ứng CSS Hover nhìn rất đẹp lên mình sẽ hướng dẫn các bạn sử dụng nhé !!DEMO BUTTION

Các bạn mở Chỉnh Sửa Template lên rồi chèn đoạn CSS này vào phía trên ]]></b:skin>

.bsw-btn{border:2px solid;overflow:hidden;position:relative;padding:10px;display:inline-block;width:200px;text-align:center;text-decoration:none!important;text-transform:uppercase;font:500 15px Roboto;margin:10px 0}
.bsw-btn:hover{letter-spacing:2px}
.bsw-btn:after{opacity:.4;background:#4267b2;content:"";height:155px;left:-75px;opacity:2;position:absolute;top:-50px;transform:rotate(35deg);transition:all 1s cubic-bezier(0.19,1,0.22,1);width:100px;z-index:100}
.bsw-btn:hover:after{opacity:1;left:120%;-webkit-transition:all 1s cubic-bezier(0.19,1,0.22,1);transition:all 1s cubic-bezier(0.19,1,0.22,1)}

Cách sử dụng:

<center><a class='bsw-btn bsw_btn' href='https://www.tienducblog.com/' target='blank'title='Tiến Đức Blog'>Tiến Đức Blog</a></center>

KẾT LUẬNTIẾN ĐỨC BLOGNguồn: Bacsiwindows.com