Tạo button bằng CSS với hiệu ứng hover tuyệt đẹp cho Blogspot
![](http://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_VcGPWWWlHxUdzREFdn-Lypv6B425e1Gqb-jWdHlBT9zizH7M4ITw4hKs_SXTF06fT3n9sgc-i8hJGEp14OCvhOxeFEq_rGL8rK07ERbuwk4sTsK1xGsq-Rk09av7WQ/s113/admin.jpg)
Xuất bản:
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](https://3.bp.blogspot.com/-nDKODdEsaXA/Wkr9HddwziI/AAAAAAAAAq0/zovyIDK2y3Q06VzfVrYWLEMkHz87cz7SgCLcBGAs/s1600/button-dep-bang-css--------------BacSiWindows-Com.png)
![Tạo button bằng CSS với hiệu ứng hover tuyệt đẹp cho Blogspot](https://3.bp.blogspot.com/-nDKODdEsaXA/Wkr9HddwziI/AAAAAAAAAq0/zovyIDK2y3Q06VzfVrYWLEMkHz87cz7SgCLcBGAs/s1600/button-dep-bang-css--------------BacSiWindows-Com.png)
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>
Chưa có bình luận nào, hãy là người đầu tiên!