Chia sẻ button hiệu ứng hover độc đáo dành cho blogspot

- Xin chào các bạn, chào mừng các bạn quay lại với Blogspot247, ở bài viết này mình xin chia sẻ cho anh em một style button mới dành cho blogspot, button này có hiệu ứng hover thay đổi màu sắc chữ và màu của viền bên ngoài trông rất tinh tế và chuyên nghiệp.
- Button này không được đẹp như các button khác và nó chỉ có hầu như một hiệu ứng hover thôi chứ không màu mè, hoa lá như các style mà nhiều người đã chia sẻ, đây là mẫu button dành cho những người thích đơn điệu, không cầu kì, không nhiều màu sắc.

Thêm CSS cho button

- Đầu tiên bạn cho đoạn CSS sau lên trên thẻ đóng ]]></b:skin> , đây là CSS sẽ phụ trách các hiệu ứng cũng như chiều rộng , dài của button.
Copy
/*Button Download hiệu ứng hover*/
a.button-blackspy{margin: 0 0 15px;padding: 8px 40px;display: inline-block;font: 700 12px 'Roboto',sans-serif;text-transform: uppercase;border: 2px solid #ddd}
a.button-blackspy:hover{text-decoration:none!important;border-color:#66689c;color:#66689c}

 Chèn button vào bài viết

- Để chèn được button này vào bài viết, bạn chuyển qua chế độ soạn thảo html và paste đoạn HTML này vào và chỉnh sửa theo ý của bạn : 
Copy
<center>
<a class="button-blackspy ripple" href="#link">Tiêu đề button</a>
</center>

Xem demo button



Xem Demo Tải về

Tổng kết

- Bài viết đến đây là kết thúc, nếu bạn thích mẫu button này đừng quên để lại một comment góp ý và chia sẻ bài viết lên Google+, Facebook để blog thêm phát triển. Chúc các bạn có một ngày làm việc hiệu quả !
Chú ý : có chia sẻ đi đâu vui lòng ghi nguồn Blogspot247.Com
  1. chất + đơn giản
    Đúng xu hướng web đơn giản :)

    Trả lờiXóa
    Trả lời
    1. Oke :3 mà ra bài mới bên blog đi, thấy ít thủ thuật hay gì mới quá.

      Xóa
    2. từ lúc đổi tên blog tới giờ, là kh muốn viết bài luôn đó chứ :) Với lại giờ tt toàn trùng với nhau nên cũng chán viết

      Xóa
    3. Mở lại cái s2topvn rồi chăm viết thủ thuật là lại có tương tác :P

      Xóa
  2. Edit cái temp nào đẹp đẹp làm event hay share cho ae đi ông ơi.

    Trả lờiXóa
  3. https://www.phucsieupham.info/
    Liên kết cho tôi với nào

    Trả lờiXóa
  4. Đi thăm blog anh nào cũng thi nhau chia sẻ button hết nhỉ ? nhưng button cậu chất đấy :3

    Trả lờiXóa
  5. send tui xin cái rip linkthuthuat với nhân ơi
    nambadaocamkhe@gmail.com

    Trả lờiXóa
  6. Sau thời gian hoành tráng làm blog em lại đâu mất tiêu rồi Nhân :))

    Trả lờiXóa
    Trả lời
    1. Em đang mod template share ấy mà anh , chắc chiều nay có bài :P

      Xóa
CÓ THỂ BẠN ĐANG TÌM