Love beautiful code? We do too.

  1. Home
  2. Tutorial
  3. Học CSS
  4. Tổng hợp các Hiệu ứng
Previous Lesson Next Lesson

Tổng hợp các Hiệu ứng

Animation là gì ?

Animation (hay còn gọi là hiệu ứng) là tiến trình thay đổi hình dạng và tạo hiệu ứng di chuyển của các phần tử. CSS hỗ trợ rất nhiều hiệu ứng liên quan tới sự kiện chuyển động.

Bảng dưới liệt kê tất cả các hiệu ứng bạn có thể sử dụng trong CSS. Để tìm hiểu chi tiết, bạn click vào đường link đã cho.

SttTên hiệu ứng
1**[Hiệu ứng Bounce](../css/hieu_ung_bounce_trong_css.jsp)**
2**[Hiệu ứng Bounce In](../css/hieu_ung_bounce_in_trong_css.jsp)**
3**[Hiệu ứng Bounce In Down](../css/hieu_ung_bounce_in_down_trong_css.jsp)**
4**[Hiệu ứng Bounce In Left](../css/hieu_ung_bounce_in_left_trong_css.jsp)**
5**[Hiệu ứng Bounce In Right](../css/hieu_ung_bounce_in_right_trong_css.jsp)**
6**[Hiệu ứng Bounce Out](../css/hieu_ung_bounce_out_trong_css.jsp)**
7**[Hiệu ứng Bounce Out Down](../css/hieu_ung_bounce_out_down_trong_css.jsp)**
8**[Hiệu ứng Bounce Up](../css/hieu_ung_bounce_up_trong_css.jsp)**
9**[Hiệu ứng Bounce Out Left](../css/hieu_ung_bounce_out_left_trong_css.jsp)**
10**[Hiệu ứng Bounce Out Right](../css/hieu_ung_bounce_out_right_trong_css.jsp)**
11**[Hiệu ứng Bounce Out Up](../css/hieu_ung_bounce_out_up_trong_css.jsp)**
12**[Hiệu ứng Fade Down Big](../css/hieu_ung_fade_down_big_trong_css.jsp)**
13**[Hiệu ứng Fade In](../css/hieu_ung_fade_in_trong_css.jsp)**
14**[Hiệu ứng Fade In Down](../css/hieu_ung_fade_in_down_trong_css.jsp)**
15**[Hiệu ứng Fade In Left](../css/hieu_ung_fade_in_left_trong_css.jsp)**
16**[Hiệu ứng Fade In Left Big](../css/hieu_ung_fade_in_left_big_trong_css.jsp)**
17**[Hiệu ứng Fade In Right](../css/hieu_ung_fade_in_right_trong_css.jsp)**
18**[Hiệu ứng Fade In Right Big](../css/hieu_ung_fade_in_right_big_trong_css.jsp)**
19**[Hiệu ứng Fade in Up](../css/hieu_ung_fade_in_up_trong_css.jsp)**
20**[Hiệu ứng Fade In Up Big](../css/hieu_ung_fade_in_up_big_trong_css.jsp)**
21**[Hiệu ứng Fade Out](../css/hieu_ung_fade_out_trong_css.jsp)**
22**[Hiệu ứng Fade Out Down](../css/hieu_ung_fade_out_down_trong_css.jsp)**
23**[Hiệu ứng Fade Out Left](../css/hieu_ung_fade_out_left_trong_css.jsp)**
24**[Hiệu ứng Fade Out Left Big](../css/hieu_ung_fade_out_left_big_trong_css.jsp)**
25**[Hiệu ứng Fade Out Right](../css/hieu_ung_fade_out_right_trong_css.jsp)**
26**[Hiệu ứng Fade Out Right Big](../css/hieu_ung_fade_out_right_big_trong_css.jsp)**
27**[Hiệu ứng Fade Out Up](../css/hieu_ung_fade_out_up_trong_css.jsp)**
28**[Hiệu ứng Fade Out UP Big](../css/hieu_ung_fade_out_up_big_trong_css.jsp)**
29**[Hiệu ứng Flash](../css/hieu_ung_flash_trong_css.jsp)**
30**[Hiệu ứng Flip](../css/hieu_ung_flip_trong_css.jsp)**
31**[Hiệu ứng Flip In X](../css/hieu_ung_flip_in_x_trong_css.jsp)**
32**[Hiệu ứng Flip In Y](../css/hieu_ung_flip_in_y_trong_css.jsp)**
33**[Hiệu ứng Flip Out X](../css/hieu_ung_flip_out_x_trong_css.jsp)**
34**[Hiệu ứng Flip Out Y](../css/hieu_ung_flip_out_y_trong_css.jsp)**
35**[Hiệu ứng Hinge](../css/hieu_ung_hinge_trong_css.jsp)**
36**[Hiệu ứng Light Speed In](../css/hieu_ung_light_speed_in_trong_css.jsp)**
37**[Hiệu ứng Light Speed Out](../css/hieu_ung_light_speed_out_trong_css.jsp)**
38**[Hiệu ứng Pulse](../css/hieu_ung_pulse_trong_css.jsp)**
39**[Hiệu ứng Roll In](../css/hieu_ung_roll_in_trong_css.jsp)**
40**[Hiệu ứng Roll Out](../css/hieu_ung_roll_out_trong_css.jsp)**
41**[Hiệu ứng Rotate In Down Left](../css/hieu_ung_rotate_in_down_left_trong_css.jsp)**
42**[Hiệu ứng Rotate In](../css/hieu_ung_rotate_in_trong_css.jsp)**
43**[Hiệu ứng Rotate In Down Right](../css/hieu_ung_rotate_in_down_right_trong_css.jsp)**
44**[Hiệu ứng Wobble](../css/hieu_ung_wobble_trong_css.jsp)**
45**[Hiệu ứng Rotate In Up Left](../css/hieu_ung_rotate_out_up_left_trong_css.jsp)**
46**[Hiệu ứng Rotate In Up Right](../css/hieu_ung_rotate_in_up_right_trong_css.jsp)**
47**[Hiệu ứng Winggle](../css/hieu_ung_winggle_trong_css.jsp)**
48**[Hiệu ứng Rotate Out](../css/hieu_ung_rotate_out_trong_css.jsp)**
49**[Hiệu ứng Rotate Out Down Left](../css/hieu_ung_rotate_out_down_left_trong_css.jsp)**
50**[Hiệu ứng Rotate Out Down Right](../css/hieu_ung_rotate_out_down_right_trong_css.jsp)**
51**[Hiệu ứng Rotate Out Up Left](../css/hieu_ung_rotate_out_up_left_trong_css.jsp)**
52**[Hiệu ứng Rotate Out Up Right](../css/hieu_ung_rotate_out_up_right_trong_css.jsp)**
53**[Hiệu ứng Shake](../css/hieu_ung_shake_trong_css.jsp)**
54**[Hiệu ứng Swing](../css/hieu_ung_swing_trong_css.jsp)**
55**[Hiệu ứng Tada](../css/hieu_ung_tada_trong_css.jsp)**
" style="text-align: center"> Loạt bài hướng dẫn **Học CSS cơ bản và nâng cao** của chúng tôi dựa trên nguồn tài liệu của: [Tutorialspoint](http://www.tutorialspoint.com/index.htm) và [W3Schools](http://www.w3schools.com/css/)
Previous Lesson Next Lesson

Viết câu trả lời

Drop Images

0 Bình luận

Danh mục bài học

Hoclaptrinh.vn © 2017

From Coder With