Video: [Học CSS - 23] Tạo chuyển động với Transition 2025
Nếu mục tiêu của bạn là truyền tải thông tin sáng tạo trên trang web của bạn để hiển thị trên iPad hoặc iPhone, một trong những lựa chọn tốt nhất để thêm hoạt hình và các tính năng tương tác khác là sử dụng CSS 3 CSS 3 giới thiệu ba cách chính để tạo hiệu ứng và hình ảnh động tương tác: chuyển đổi, chuyển tiếp và hình động.
CSS 3 thêm nhiều tính năng thiết kế mới, nhưng hoạt hình là thú vị nhất. Sử dụng CSS 3, bạn có thể làm cho nhân vật đi ngang qua màn hình, hộp lật, và hình ảnh mờ dần. Để chứng minh làm thế nào hoạt hình hoạt hình với CSS 3, con số này cho thấy một quả bóng đơn giản mà bị trả lại trong một hộp đen.
Không có hình ảnh nào được sử dụng để tạo ra hình ảnh bóng nảy. Bóng chính nó - và hành động làm cho nó xuất hiện trở lại từ phía trên cùng của màn hình xuống phía dưới và ngược lại - tất cả đã đạt được chỉ với một vài dòng mã CSS3.
Ảnh động như công việc này trong các trình duyệt phổ biến nhất sử dụng WebKit, bao gồm Safari (trên Mac, Windows và iOS cho iPad / iPhone / iPad) và Chrome (trên Mac, Windows và các thiết bị chạy hệ điều hành Android của Google).
Bạn có thể tạo nhiều hiệu ứng thiết kế tuyệt vời với các tính năng này, nhưng các trang web tương tác nhất mà bạn nhìn thấy trên web hiện nay đòi hỏi phải có JavaScript ngoài HTML và CSS.
