[ Tips ] - Tự thay đổi màu nền & hình nền cho blogger

Tự động thay đổi hình nền cho blogger và màu nền cho blogpot chuyên nghiệp!

Hôm nay Kid1412 sẽ chỉ cho bạn thủ thuật Tự thay đổi màu nền & hình nền cho blogger và làm thế nào bạn có thể làm thay đổi màu nền, hình nền blog của bạn, với các màu sắc khác nhau bằng cách sử dụng CSS. Trước đây mình cũng đã giới thiệu thủ thuật này một lần rồi, nhưng đây là thủ thuật Tự động thay đổi hình nền Blogspot theo thời gian.

Nhưng giờ thì qua thủ thuật mới hơn này, mặc dù trong thủ thuật này, bạn có thể sử dụng hình ảnh lớn để làm nền, nhưng các bạn yên tâm, Kid1412 đã tối ưu hóa nó và giúp nó có thể tải cực nhanh, nâng cao trải nghiệm người dùng trên website hay blog của bạn. Nào, giờ thì cùng Kid1412 tìm hiểu thủ thuật Tự thay đổi màu nền & hình nền cho blogger/blogspot nhé!

>>Tự động thay đổi hình nền Blogspot theo thời gian
>>Thay đổi nền ngẫu nhiên cho blog khi refrest

Cùng với Kid1412 bắt đầu với thủ thuật Tự thay đổi màu nền & hình nền cho blogger/blogspot nào!

Bước 1 - Thay thế các mã code cũ

Bạn cần thay thế các mã code cũ mà có thể gây xung đột với code mới này, cách đơn giản là bạn vào Blogger -> Mẫu -> Chỉnh sửa HTML và nhấn tổ hợp phím Ctrl + F và nhập tìm kiếm body và xóa nền của nó đi. Nền là background đó nhé! Và trong trường hợp bạn không tìm được, bạn tham khảo hình ảnh dưới đây nhé!

Bước 2 - Thêm mã vào website của bạn.

Đầu tiên bạn cần vào Blogger -> Mẫu -> Chỉnh sửa HTML và nhấn tổ hợp phím Ctrl + F và nhập tìm kiếm ]]></b:skin> và sao chép đoạn mã dưới đây vào trước nó nhé! Và sau đó lưu mã đó lại!

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475body {

    animation: colorBackground 20s infinite; /* Chrome, Firefox 16+, IE 10+, Opera 12.10+ */

     -webkit-animation: colorBackground 20s infinite; /* Chrome, Safari 5+ */

      -moz-animation: colorBackground 20s infinite; /* Firefox 5-15 */

        -o-animation: colorBackground 20s infinite; /* Opera 12.00 */

}

@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; }

}

Đây là một thủ thuật thay đổi hình nền và thay đổi màu nền cho blogger blogspot rất hay mà Kid1412 mang đến cho bạn. Nếu bạn thấy hay, hãy share nó đi nhé, hoặc có chổ nào không hiểu, hãy gửi ý kiến, bình luận ở dưới đây nha. Kid1412 sẽ chia sẻ và hướng dẫn sâu hơn về vấn đề này.