SHARE MẪU BUTTON CỰC ĐẸP CHO BLOGSPOT

Share Copy URL

Lời Mở Đầu

Chào mừng các bạn đã ghé thăm blog của mình .Blog mới thành lập gần đây tuy nhiên đã thu hút được khá nhiều sự chú ý của đọc giả.Hôm nay , mình bỗng nhận thấy là blog của mình chẳng có bài nào về thủ thuật blogspot cho nên mình quyết định hôm nay sẽ viết 1 bài về chủ đề này . Đó là bài share button download cực chất.

Các Bước Thực Hiện

Bắt Đầu Các bạn vô chủ đề →chỉnh sửa html sau đó các bạn tìm đến thẻ ]]></b:skin>  rồi thêm đoạn code phía dưới vô trước nó.

/* BUTTON NGUYENDIENBLOG */
.ndblog-button:link,
.ndblog-button:visited {position: relative;display: block;margin: 30px auto 0;padding: 14px 15px;color:#fff;font-size:14px;font-weight: bold;text-align: center;text-decoration: none;text-transform: uppercase;overflow: hidden;letter-spacing: .08em;border-radius: 0;text-shadow: 0 0 1px rgba(0, 0, 0, 0.2), 0 1px 0 rgba(0, 0, 0, 0.2);-webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease;transition: all 1s ease}
.ndblog-button:link:after,
.ndblog-button:visited:after {content: "";position: absolute;height: 0%;left: 50%;top: 50%;width: 150%;z-index: -1;-webkit-transition: all 0.75s ease 0s;-moz-transition: all 0.75s ease 0s;-o-transition: all 0.75s ease 0s;transition: all 0.75s ease 0s;}
.ndblog-button:link:hover,
.ndblog-button:visited:hover {color: #FFF;text-shadow: none;}
.ndblog-button:link:hover:after,
.ndblog-button:visited:hover:after {height: 450%;
}
.ndblog-button:link,
.ndblog-button:visited {position: relative;display: block;margin: 30px auto 0;padding: 12px ;width: 200px; ;color: #7f3787;font-size:14px;border-radius: 50 px;font-weight: bold;text-align: center;text-decoration: none;text-transform: uppercase;overflow: hidden;letter-spacing: .08em;text-shadow: 0 0 1px rgba(0, 0, 0, 0.2), 0 1px 0 rgba(0, 0, 0, 0.2);-webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease;transition: all 1s ease;}
.btn-ndb {border: 2px solid #7f3787;}
.btn-ndb:after {background: #7f3787;-moz-transform: translateX(-50%) translateY(-50%) rotate(-25deg);-ms-transform: translateX(-50%) translateY(-50%) rotate(-25deg);-webkit-transform: translateX(-50%) translateY(-50%) rotate(-25deg);transform: translateX(-50%) translateY(-50%) rotate(-25deg);}
/* END BUTTON NGUYENDIENBLOG */

Rồi Khi Sử Dụng Các Bạn Chỉ Dùng Đoạn Code Sau :

<a class="ndblog-button btn-ndb" href="https://www.facebook.com/">Sign up</a>

Chúc Các Bạn Thành Công#CODEPEN