Tạo hiệu ứng xoay tròn cho ảnh

Bài viết dành cho những người thích "VỌC" để phòng ngừa bệnh mất trí nhớ !
Trong mấy ngày gần đây tôi có viết mấy bài liên quan đến tạo các hiệu ứng hover cho ảnh chèn ở bài viết của Blog. Hiệu ứng hover cho ảnh hiểu nôm na là khi ta rê chuột vào một ảnh nào đó hiệu ứng sẽ xẩy ra (phóng to, thu nhỏ, tịnh tiến, xoay tròn...).
   Thực ra để thục hiện các hiệu ứng hover cho ảnh trên blog, ta có thể tác động trực tiếp vào HTML của Blog bằng cách thêm CSS rồi sau đó ở bài viết ta chỉ cần chèn phần code thủ thuật HTML thôi. Với cách tác động vào mẫu (Template) của Blog là cách làm bài bản nhất. Có điều không phải các bài viết có ảnh chúng ta đều muốn sứ dụng hiệu ứng hover.
Trong tất cả các hover cho ảnh theo ý kiến cá nhân thì hover phóng to ảnh là nên làm theo cách tác động vào mẫu của Blog thôi. Còn các hover khác ta nên chèn trực tiếp vào bài viết lúc cần thôi! Chèn trực tiếp vào bài viết thì bạn phải kết hợp CSS và HTML làm một.
Phần CSS được đặt trước HTML ! Phần CSS phải được đặt trong thẻ STYLE (đóng, mở) các bạn nhé thì CSS mới hoạt động ! (tham khảo thêm ở phần code mẫu tôi cho).
   Hôm nay tôi chia sẽ với các bạn tạo hiệu ứng XOAY TRÒN cho ảnh nhé !
Các bạn kích vào hình bên cạnh để xem trước:
Vì đã nói chi tiết ớ các bài trước rồi nên tôi không nói kỹ từng bước tiến hành nữa, OK ? Nếu chưa rõ lắm các bạn có thể tham khảo thêm chi tiết hơn ở đây
Các bạn dùng đoạn code mẫu sau đây:
Các bạn chỉ cần thay link ảnh của mình vào trong code mẫu là tạm ổn rồi. Bạn nào biết kha khá về CSS thì có thể thay đổi thêm. Những chỗ thay đổi được tôi đã có chú thích !
Các bạn copy code đã chỉnh sửa và dán vào nơi muốn nó xuất hiện ở chế độ HTML trong soạn thảo bài đăng rồi xuất bản là OK rồi.
Source from (Nguồn bài đăng): minh lương và mọi người


Previous
Next Post »