What you'll learn
Nắm vững kiến thức nền tảng về HTML và CSS: Hiểu rõ cấu trúc và cách sử dụng các thẻ HTML để tạo nội dung trang web, Nắm vững cú pháp và cách áp dụng các thuộc tính CSS để định dạng và thiết kế giao diện
Làm chủ các kỹ năng xây dựng trang web: Khả năng tạo dựng trang web đơn giản với cấu trúc và giao diện hoàn chỉnh, Hiểu cách thức hoạt động của các thành phần HTML và CSS trong trang web
Thiết kế giao diện web đẹp mắt và thân thiện: Áp dụng các khái niệm như box model, layout để tạo bố cục trang web khoa học, Sử dụng các thuộc tính CSS để tạo giao diện thu hút, linh hoạt và phù hợp với người dùng
Skills you'll gain
Lập trìnhCourse content
0 Sections
•
0 Lessons
•
0h 0m
Expand all section
HTML, CSS from Zero to Hero 1
5 Lessons
•
18 minutes 56 seconds
Overview of the HTML CSS course at F8 | Learn basic web programming | What do you learn in the course?03:15
What is HTML CSS? | Visual examples of HTML & CSS02:29
Get familiar with Dev tools | Introducing the Dev tools toolkit on the browser03:55
Install the environment and necessary tools to start learning HTML and CSS02:57
HTML file structure | Initialize project folder in HTML06:20
HTML, CSS from Zero To Hero 2
5 Lessons
•
26 minutes 45 seconds
Comments in HTML | Syntax for opening and closing Comments02:12
Common HTML tags11:08
Attributes in HTML | Add attributes (Attributes) to the tag01:54
How to use CSS in HTML | Detailed instructions for each method07:13
ID and Class in CSS selectors04:18
HTML, CSS from Zero To Hero 3
5 Lessons
•
37 minutes 41 seconds
Priority in CSS10:31
What is CSS Variable? | How to set variables in CSS03:48
What are CSS Units? | Units in CSS10:56
Padding property in CSS | CSS Padding06:20
Border property in CSS | CSS Border06:06
HTML, CSS from Zero To Hero 4
5 Lessons
•
31 minutes 01 seconds
Margin property in CSS | Thinking about using CSS Margin05:31
CSS Box-sizing | Applicability of Box-sizing05:12
CSS Background-clip | Background-clip property04:14
CSS Background-image | Background-image property12:47
Thuộc tính Background-size | CSS Background-size03:17
HTML, CSS from Zero To Hero 5
5 Lessons
•
19 minutes 40 seconds
Background-origin | property CSS Background-origin02:58
Background-position | property CSS Background-position04:15
Shorthand syntax | CSS Background shorthand02:30
CSS Functions | Functions in CSS06:14
CSS Pseudo classes03:43
HTML, CSS from Zero To Hero 6
5 Lessons
•
24 minutes 04 seconds
CSS Pseudo-elements06:15
CSS Positon: Relative03:04
CSS Position: Absolute07:58
CSS Position: Fixed03:29
CSS Position: Sticky03:18
HTML, CSS from Zero To Hero 7
5 Lessons
•
76 minutes 40 seconds
Introducing Flexbox | Flexbox property in CSS05:57
CSS properties used in Flexbox06:26
Learn Flexbox CSS through examples | Flexbox CSS | Flexbox layout | Flexbox example | Flexbox in CSS35:04
[Advanced Flexbox] Relate Flex model to Flexbox properties in CSS14:23
What is CSS BEM? Naming CSS Class According to BEM Standards14:50
HTML, CSS from Zero To Hero 8
5 Lessons
•
104 minutes 26 seconds
Use BEM to create buttons | Application of BEM in CSS16:14
Use BEM to create Toast Message UI35:49
BEM Answers | How to name nested Blocks10:43
Optimize performance when using images with srcset? How to use the srcset attribute of an IMG tag?38:46
Build source base | Sales website with HTML CSS02:54
HTML, CSS from Zero To Hero 9
5 Lessons
•
59 minutes 57 seconds
Reset CSS and use Reset CSS05:03
Build CSS base | Practice building Base CSS for websites10:14
Build a web framework | Create layouts for the web11:12
Navbar CSS23:50
Embed Font-Icons09:38
HTML, CSS from Zero to Hero 10
5 Lessons
•
112 minutes 17 seconds
Icons CSS08:21
Header QR code CSS33:07
Header notification CSS - Part 138:28
Header notification CSS - Part 219:05
Header notification CSS - Part 313:16
HTML, CSS from Zero to Hero 11
5 Lessons
•
86 minutes 37 seconds
Header notification CSS - Part 404:29
Base modal12:13
Build a registration form frame16:42
CSS registration form26:59
CSS registration form - Part 226:14
HTML, CSS from Zero to Hero 12
5 Lessons
•
105 minutes 57 seconds
CSS login form16:00
Modal animation06:15
Build a search box19:53
CSS search header40:03
CSS search history23:46
HTML, CSS from Zero to Hero 13
5 Lessons
•
116 minutes 46 seconds
CSS empty shopping cart header25:55
Header cart badge10:46
Header cart - List products35:19
Header user info28:06
Header fix ui bugs16:40
HTML, CSS from Zero to Hero 14
5 Lessons
•
87 minutes 02 seconds
Build a catalog section14:53
Category - base responsive10:53
CSS categories21:49
Building a frame: Sorting and filtering products11:03
CSS: Sort and filter products28:24
HTML, CSS from Zero to Hero 15
5 Lessons
•
94 minutes 30 seconds
Build product frames18:12
CSS Products - Part 125:26
CSS Products - Part 218:42
CSS Products - Part 313:41
Product: CSS favorite label18:29
HTML, CSS from Zero to Hero 16
5 Lessons
•
100 minutes 47 seconds
Product: CSS discount label17:55
Complete the product section16:50
Fix UI bugs - Part 235:10
Pagination UI14:45
Build the footer frame16:07
HTML, CSS from Zero to Hero 17
5 Lessons
•
45 minutes 02 seconds
Footer CSS21:27
Final chapter HTML, CSS | Final Project Preparation Work02:54
01. Introducing The Band project | Practice basic HTML CSS cutting | Analyze web interface02:53
04. Create a framework for The Band project | Build project base | Basic HTML and CSS course for beginners10:16
03. Project analysis07:32
HTML, CSS from Zero to Hero 18
5 Lessons
•
106 minutes 21 seconds
02. Distinguish and name the components16:15
07. Header search CSS20:11
06. Navigation CSS28:46
05. Header CSS33:50
08. Header fixed CSS07:19
HTML, CSS from Zero to Hero 19
5 Lessons
•
102 minutes 52 seconds
09. Slider CSS27:21
10. About section CSS17:47
11. Team section CSS14:07
12. Tour tickets CSS19:27
13. Tour places CSS24:10
HTML, CSS from Zero To Hero 20
5 Lessons
•
104 minutes 19 seconds
13.1. Buy Tickets Modal (additional video)43:07
14. Row - columns layout15:26
15. Contact form CSS24:14
16. Map & footer CSS15:09
17. Review06:23
HTML, CSS from Zero to Hero 21
5 Lessons
•
79 minutes 31 seconds
18. What is Responsive?05:50
19. Media queries?15:38
20. Tablet responsive09:47
21. Mobile menu responsive35:39
22. Mobile menu fix bug12:37
HTML, CSS from Zero to Hero 22
5 Lessons
•
87 minutes 10 seconds
23. Mobile fix bug submenu20:18
24. Content responsive14:43
25. Contact form responsive13:42
26. Review21:26
27. Run and fix bug on mobile17:01
HTML, CSS from Zero to Hero 23
3 Lessons
•
68 minutes 00 seconds
28. Fix bugs17:02
13.2. Buy Tickets Modal Javascript Logic (additional video)27:49
Basic CSS selectors | Learn HTML CSS for free23:09
Instructor
F8 VN