Tạo button bằng CSS với hiệu ứng hover tuyệt đẹp cho Blogspot

Monday, January 1, 2018

Tạo button bằng CSS với hiệu ứng hover tuyệt đẹp cho Blogspot. Button bằng CSS, hiệu ứng hover đẹp.
Tạo button bằng CSS với hiệu ứng hover tuyệt đẹp cho Blogspot

Chèn CSS


button{background:#55579e;border:none;position:relative;transition:800ms ease all;outline:none;font:500 16px "Roboto",sans-serif;text-transform:uppercase}
button a{color:#fff!important;padding:.5em 3em;display:block}
button:hover a{color:#55579e!important;text-decoration:none!important}
button:hover{background:transparent}
button:before,button:after{content:'';position:absolute;top:0;right:0;height:2px;width:0;background:#55579e;transition:900ms ease all}
button:after{right:inherit;top:inherit;left:0;bottom:0}
button:hover:before,button:hover:after{width:100%;transition:800ms ease all}

Cách sử dụng

<button><a href="https://www.bacsiwindows.com/" target"blank">BÁC SĨ WINDOWS</a></button>

Result

Subscribe box

Nhập địa chỉ Email và bấm đăng ký, bạn sẽ nhận được bài viết mới nhất từ STAR SINH BLOG hoàn toàn miễn phí qua Gmail!

0 Nhận xét: