Khóa học HTML CSS Master dành cho người mới bắt đầu

Nắm vững toàn bộ kiến thức HTML CSS từ cơ bản đến nâng cao dễ dàng thông qua dự án thực tế dành cho người mới

4.6

(737 đánh giá)

2,948 học viên

Giảng viên

Evon Dev

Đánh giá cao

79.000đ 399.000đ -80%

✓ Xem giỏ hàng và thanh toán

Mua trực tiếp qua Zalo Học thử bài 1

27.0 giờ video

1 tài nguyên

Truy cập vĩnh viễn

Học trên mọi thiết bị

Cập nhật: 18/09/2026

Bạn sẽ học được gì

Nắm vững kiến thức HTML CSS chuẩn chỉnh từ đầu

Thực hành dự án thực tế

Code cực nhanh và hiệu quả với PUG, SASS

Có nhóm hỗ trợ khi gặp khó khăn trong quá trình học

Được chia sẻ thiết kế đẹp, xịn xò để thực hành sau khi hoàn thành khóa học

Được tặng Ebooks hay về UI UX sau khi hoàn thành khóa học

Biết thêm cách sử dụng Figma

Cải thiện tư duy về layout nhanh chóng

Yêu cầu

Chỉ cần có Laptop cài đặt được VSCode là có thể học được

Đối tượng phù hợp

Người mới hoàn toàn bắt đầu tìm hiểu HTML CSS

Người đang có kiến thức cơ bản về HTML CSS

Người muốn cải thiện trình độ code giao diện HTML CSS

Nội dung khóa học

3 phần • 62 bài giảng

1 Bài 1: Giới thiệu khóa học

2 Bài 2: Các thiết lập quan trọng

1 Bài 3: Các kiến thức cơ bản cần nắm kỹ

2 Bài 4: Phân tích tổng quan giao diện Tour Item

3 Bài 5: Google fonts, css reset và selectors

4 Bài 6: Nắm vững Box Sizing

5 Bài 7: Thuộc tính margin, line-height và display

6 Bài 8: Thuộc tính min và max-width, flexbox cơ bản

7 Bài 9: Flexbox cơ bản, các thuộc tính về chữ

8 Bài 10: Tìm hiểu Pug cơ bản phần 1

9 Bài 11: Tìm hiểu Pug cơ bản phần 2

10 Bài 12: Nắm vững thuộc tính position

11 Bài 13: Responsive cơ bản

12 Bài 14: Thực hành giao diện Popuplar

13 Bài 15: Thực hành giao diện Popuplar tiếp theo

14 Bài 16: CSS Variables

15 Bài 17: Tối ưu giao diện

16 Bài 18: CSS Grid

17 Bài 19: Thực hành CSS Grid phần 1

18 Bài 20: Thực hành CSS Grid phần 2

19 Bài 21: Phân tích giao diện Footer

20 Bài 22: Tìm hiểu các thẻ và thuộc tính liên quan tới Form

21 Bài 23: Tối ưu Responsive các sections và footer

22 Bài 24: Sử dụng extend layout trong Pug, cài đặt và sử dụng Sass cơ bản

23 Bài 25: Kiến thức Sass cơ bản: biến, nested, import, 7-1 pattern

24 Bài 26: Flexbox nâng cao, transition, sass mixins

25 Bài 27: Sass mixins nâng cao, auto-fit và auto-fill

26 Bài 28: Dàn layout phức tạp với CSS Grid Area

27 Bài 29: Tìm hiểu pseudo before và after, column,

28 Bài 30: CSS scroll, ratio, order, counter

29 Bài 31: Nắm vững clamp, min, max và container queries

30 Bài 32: Flexbox nâng cao

31 Bài 33: Sự khác nhau giữa đơn vị em và rem

32 Bài 34: Sử dụng đơn vị nào khi dùng media queries

33 Bài 35: Tùy biến checkbox

34 Bài 36: Tùy biến radio và toggle

35 Bài 37: Tùy biến Dropdown

36 Bài 38: Tìm hiểu hàm translate

37 Bài 39: Tìm hiểu hàm scale

38 Bài 40: Tìm hiểu hàm skew

39 Bài 41: Tìm hiểu clip-path và shape-outside

40 Bài 42: Table cơ bản

41 Bài 43: Những giao diện nâng cao với Input

1 Bài 44: Thiết lập dự án GocastUI

2 Bài 45: Thiết lập cấu trúc Pug

3 Bài 46: Tìm hiểu use và forward trong Sass

4 Bài 47: Tối ưu cấu trúc thư mục Sass

5 Bài 48: Phân tích và code Sidebar phần 1

6 Bài 49: Phân tích và code Sidebar phần 2

7 Bài 50: Xử lý hover icon svg hiệu quả

8 Bài 51: Tối ưu inline svg icon trong Pug

9 Bài 52: Phân tích và code Topbar

10 Bài 53: Popuplar host phần 1

11 Bài 54: Popuplar host phần 2

12 Bài 55: Trending section

13 Bài 56: Feed Header

14 Bài 57: Giao diện Feed Item

15 Bài 58: Giao diện Widgets

16 Bài 59: Responsive layout tổng quan

17 Bài 60: Giao diện Dark Mode

18 Bài 61: Độ ưu tiên cần nắm và kinh nghiệm đè code cần phải biết (Bonus)

19 Bài 62: Code giao diện trang Playlist (Bonus)

Giới thiệu khóa học

Nếu bạn chưa biết gì về HTML CSS, hoặc chỉ đơn giản là người mới tìm hiểu về Frontend bắt đầu học HTML CSS, người muốn cải thiện trình độ HTML CSS được chuyên sâu hơn thì khóa này chắc chắn sẽ phù hợp với bạn. Khóa học sẽ hướng dẫn không chỉ kiến thức kỹ càng mà còn về kinh nghiệm cắt giao diện từ Figma sang HTML CSS chỉn chu và nhanh gọn lẹ.

Ngoài những kiến thức thông qua video, mình còn cô đọng lại trong một file riêng để các bạn có thể xem lại nữa. Ngoài ra các bạn còn học được thêm về kiến thức layout, components, props, biến, vòng lặp... để sau này các bạn học qua Javascript hay các frameworks, libraries như React, Vue, Angular không còn bỡ ngỡ nữa luôn.

Sau khi hoàn thành khóa học này, các bạn sẽ có thể tự tay code các trang web từ đơn giản đến phức tạp một cách hoàn chỉnh. Bằng việc nắm vững kiến thức HTML để sử dụng các thẻ đúng đắn, nắm tốt kiến thức CSS để có thể tùy biến giao diện một cách nhanh chóng. Code nhiều giao diện giống nhau bằng việc tái sử dụng code thông qua dùng PUG, biết cách tối ưu code, tinh chỉnh linh động cho các trang web một cách chỉn chu.