• Tự động thay đổi màu nền cho Blog sử dụng CSS3

Tự động thay đổi màu nền cho Blog sử dụng CSS3

Chào các bạn, bài viết này mình sẽ hướng dẫn các bạn thủ thuật nhỏ giúp cho blog Tự động thay đổi màu nền cho Blog sử dụng CSS3. Thủ thuật này sử dụng hoàn toàn CSS để thay đổi màu nền cho blog, màu sắc sẽ thay đổi sau mỗi giây với hiệu ứng chuyển động mượt mà! Các bạn có thể xem demo nay tại bài viết này.

Hướng dẫn thực hiện


Bước 1: Đăng nhập Blogger > Chủ đề > Chỉnh sửa HTML.
Bước 2: Copy và paste đoạn CSS sau vào trước thẻ ]]></b:skin> trong template.
body{animation:colorBackground 20s infinite;-webkit-animation:colorBackground 20s infinite;-moz-animation:colorBackground 20s infinite;-o-animation:colorBackground 20s infinite}
@keyframes colorBackground{0%{background-color:#fbcf61;color:#fbcf61}20%{background-color:#6bd57e;color:#6bd57e}40%{background-color:#ff6f6f;color:#ff6f6f}60%{background-color:#57cff4;color:#57cff4}80%{background-color:#0ed4c8;color:#0ed4c8}100%{background-color:#fbcf61;color:#fbcf61}}
@-webkit-keyframes colorBackground{0%{background-color:#fbcf61;color:#fbcf61}20 {background-color:#6bd57e;color:#6bd57e}40%{background-color:#ff6f6f;color:#ff6f6f}60%{background-color:#57cff4;color:#57cff4}80%{background-color:#0ed4c8;color:#0ed4c8}100%{background-color:#fbcf61;color:#fbcf61}}
@-moz-keyframes colorBackground{0%{background-color:#fbcf61;color:#fbcf61}20%{background-color:#6bd57e;color:#6bd57e}40%{background-color:#ff6f6f;color:#ff6f6f}60%{background-color:#57cff4;color:#57cff4}80%{background-color:#0ed4c8;color:#0ed4c8}100%{background-color:#fbcf61;color:#fbcf61}}
@-o-keyframes colorBackground{0%{background-color:#fbcf61;color:#fbcf61}20%{background-color:#6bd57e;color:#6bd57e}40%{background-color:#ff6f6f;color:#ff6f6f}60%{background-color:#57cff4;color:#57cff4}80%{background-color:#0ed4c8;color:#0ed4c8}100%{background-color:#fbcf61;color:#fbcf61}}
Bước 3: Lưu template.

Lời kết 

Vậy là bạn chỉ với vài ba bước bạn đã giúp cho blog của mình trở nên sinh động hấp dẫn hơn rồi.
Bạn cũng có thể áp dụng cho các phần khác trên blog như widget, button, màu chữ,...
Chúc các bạn thành công!