Cách làm chữ nhấp nháy bằng CSS3 dành cho Blogpspot

Bạn đang muốn làm chữ nhấp nháy trong Blogspot, nhưng ngại sử dụng Javascript hay CSS hay JQUERY vì nó rất phức tạp và làm nặng blog.Với cách làm bằng Blink text lại không đáp ứng được cho bạn. Hôm nay mình sẽ hướng dẫn cho các bạn cách làm chữ nhấp nháy bằng CSS3 dành cho Blogpspot của mình với sự hỗ trợ của thuộc tính @keyframes.

@keyframes có nhiệm vụ điều khiển diễn biến một hoạt động của một thành phần, và cụ thể chính là điều khiển cái phần màu mè của “Chữ nhấp nháy”

Anination có nhiệm vụ làm cho “chữ nhấp nháy ” nhấp nháy

Đầu tiên bạn đăng nhập Blogger

Vào Chủ đề >> Chỉnh sửa HTML

Dán đoạn CSS vào trước thẻ ]]></b:skin> và Lưu lại

Trong đoạn css trên bạn chỉ cần chú ý 2 thuộc tính @keyframes và animation và:

  • moz- hỗ trợ cho firefox.
  • webkit- hỗ trợ cho Google Chrome và Safari.

Tiếp theo bạn chỉ cần đặt đoạn HTML này ở vị trí bạn muốn là xong

Giải thích chút về code:

my: là tên của thuộc tính mình đặt, tên thuộc tính này được animation sử dụng

0%,50%,100%: là các thuộc tính css cho từng giai đoạn, ở đây mình sử dụng thuộc tính color để đổi 2 màu trắng và cam thay đổi nhau

Và trong class “test” bạn cho thuộc tính animation chữ trong class chuyển động theo ý bạn

  • my: là tên animation, và trong trường hợp này thì glowing chính là tên thuộc tính mình đặt ở trên keyframes
  • 700ms: là thời gian chuyển động (1s = 1000ms)
  • infinite: để cho animation luôn chuyển động (có nghĩa là nó sẽ nhấp nháy mãi).

Chúc bạn thành công!

Viết một bình luận