F8 - Khóa học HTML-CSS từ đầu

F8 Fullstack - Khóa học HTML-CSS từ đầu, học HTML, Học CSS ở đâu, Website học HTML CSS từ Zero đến Hero cùng F8

Bạn sẽ học được gì sau khóa học HTML, CSS từ Zero đến Hero của F8 Full-stack
  • Biết cách xây dựng giao diện web với HTML, CSS
  • Biết cách phân tích giao diện website
  • Biết cách đặt tên class CSS theo chuẩn BEM
  • Biết cách làm giao diện web responsive

HTML là gì

HTML viết tắt của Hypertext Markup Language (tiếng việt là hay là "Ngôn ngữ Đánh dấu Siêu văn bản") là ngôn ngữ để xây dựng và cấu trúc lại các thành phần có trong website

CSS là gì

CSS là chữ viết tắt của Cascading Style Sheets, nó là một ngôn ngữ được sử dụng để tìm và định dạng lại các phần tử HTML có trong webiste

Sử dụng CSS giúp trang web trở nên đẹp hơn và sống động hơn với nhiều phong cách và format khác nhau.

Tại sao lại cần học HTML và CSS

Nếu bạn học lập trình Web tất nhiên bạn phải học HTML và CSS rồi, bởi ví đó là hai thứ tạo ra phần giao diện và nội dung của một trang web.

Học HTML và CSS có khó không?

Bạn có thể học từ đầu mà không cần có kiến thức trước đó.

Chỉ cần bạn chịu khó học tìm hiểu và thực hành nhiều ví dụ là có thể làm được

Mình nghĩ HTML và CSS là dễ học vì nó khá trực quan

Bạn cần chuẩn bị những gì khi học HTML và CSS

Bạn cần có máy tính kết nối internet để xem các video bài giảng này

Một máy tính có cài một trình duyệt web

Một phần mêm soạn thảo cơ bản như Notepad, Visual Studio Code, Nodepad ++, Sublime Text...

Vậy chúng ta hãy cùng tham gia khóa học F8 HTML CSS từ đầu dành cho tất cả các bạn nhé


Video:

Đang xem:

Nhận được gì sau khóa học? | Học lập trình web cơ bản | Tự học lập trình online
2. 14. Row - columns layout 15 phút 25 giây
Thực hành 14. Row - columns layout
3. HTML, CSS là gì? 2 phút 28 giây
Cùng tìm hiểu HTML, CSS là gì?, HTML có gì hay ho
4. Làm quen với Dev tools 3 phút 54 giây
Khi lập trình web các lập trình viên thường hay phải sử dụng các công cụ phát triển Dev Tool sẽ giúp bạn tiết kiệm thời gian và nâng cao hiệu suất làm việc.
Cài đặt môi trường viết HTML CSS như thế nào, Tool để viết HTML CSS
6. Cấu trúc file HTML 6 phút 20 giây
Tìm hiểu Cấu trúc file HTML, file HTML gồm những gì nào?
7. Comments trong HTML 2 phút 12 giây
Cách ghi chú trong HTML, hướng dẫn Comments trong HTML
8. Thẻ HTML thông dụng 11 phút 8 giây
Giới thiệu các Thẻ HTML thông dụng, một số thẻ HTML hay dùng
Giới thiệu Attribute trong HTML, các thuộc tính của thẻ HTML
10. Sử dụng CSS trong HTML 7 phút 13 giây
Cách Sử dụng CSS trong HTML, làm thế nào để viết CSS trong HTML
11. ID và Class trong HTML 4 phút 18 giây
ID và Class trong HTML là gì, cùng tìm hiểu ID và Class trong HTML
12. Độ ưu tiên trong CSS 10 phút 31 giây
Cách tính Độ ưu tiên trong CSS , độ ưu tiên của HTML là gì
13. Đặt biến trong CSS 3 phút 48 giây
Cách đặt biến trong CSS, làm thế nào đặt biển ở CSS
14. Đơn vị trong CSS 10 phút 56 giây
Các đơn vị trong CSS dùng như thế nào, đơn vị style css html
15. CSS Padding 6 phút 20 giây
CSS Padding là gì, giới thiệu về Padding trong css
16. CSS Border 6 phút 6 giây
CSS Border là gì, hiểu về CSS Border
17. CSS Margin 5 phút 31 giây
Hướng dẫn CSS Margin, hiểu về CSS Margin như thế nào cho đúng
18. CSS Box-sizing 5 phút 12 giây
CSS Box-sizing là gì, hướng dẫn về Box-sizing trong CSS
19. CSS Background-clip 4 phút 14 giây
CSS Background-clip là gì, cách đặt Background-clip trong CSS
20. CSS Background-image 12 phút 47 giây
CSS Background-image là gì, Đặt ảnh nền trong css, sét ảnh nền trong thẻ HTML
21. CSS Background-size keywords 3 phút 17 giây
CSS Background-size keywords là gì, hiểu về Background-size trong CSS
22. CSS Background-origin 2 phút 58 giây
CSS Background-origin là gì
23. CSS Background-position 4 phút 15 giây
CSS Background-position, cách sét position của background trong CSS
24. CSS Background shorthand 2 phút 30 giây
CSS Background tổng hợp thực hành về Background trong CSS
25. CSS Functions 6 phút 14 giây
CSS Functions là gì
26. Pseudo classes 3 phút 43 giây
Pseudo classes là gì, kỹ năng viết Pseudo classes trong CSS
27. Pseudo elements 6 phút 15 giây
Pseudo elements là gì, Pseudo elements trong HTML
28. CSS Position: Relative 3 phút 4 giây
CSS Position: Relative là gì, Relative trong CSS như thế nào
29. CSS Position: Absolute 7 phút 58 giây
CSS Position: Absolute là gì, thuộc tính Absolute trong CSS như thế nào
30. CSS Position: Fixed 3 phút 29 giây
CSS Position: Fixed là gì, thuộc tính Fixed trong CSS Position
31. CSS Position: Sticky 3 phút 18 giây
CSS Position: Sticky là gì, thuộc tính Sticky trong CSS Position
32. Giới thiệu Flexbox 5 phút 57 giây
Giới thiệu Flexbox trong CSS, Flexbox CSS là gì
Flexbox CSS là gì, các Thuộc tính CSS trong Flexbox
Học Flexbox CSS qua ví dụ | Flexbox CSS | Flexbox layout | Flexbox example | Flexbox trong CSS
[Để học Flexbox tốt hơn] Liên hệ Flex model với các thuộc tính flexbox trong CSS
Tìm hiểu tiêu chuẩn BEM là gì và cách đặt tên class trong css/html như thế nào nhé. Tiêu chuẩn CSS BEM là gì
Cách dùng BEM tạo buttons, thực hành dùng BEM tạo buttons
BEM là gì:, Ví dụ dùng BEM tạo Toast Message UI trong CSS
BEM - Khi các Block lồng nhau thì đặt tên như thế nào? Cách dùng Block lồng nhau trong BEM CSS
40. Dựng source base 2 phút 54 giây
Cách dựng source base trong CSS
41. Reset CSS 5 phút 3 giây
Hiểu về Reset CSS, Tìm hiểu Reset trong HTML là gì
42. Dựng CSS base 10 phút 14 giây
Cách dựng CSS base, hiểu về CSS base là gì
43. Dựng khung web 11 phút 12 giây
Cách dựng khung web, dựng khung giao diện trong CSS web
44. Navbar CSS 23 phút 50 giây
Navbar CSS là gì, cách làm menu Navbar trongCSS
45. Nhúng Font-Icons 9 phút 38 giây
Cách nhúng Font-Icons trong CSS, dùng icon css như thế nào thay ảnh icon
46. Icons CSS 8 phút 21 giây
Icons trong CSS, sử dụng icon trong css như thế nào
47. Header QR code CSS 33 phút 7 giây
Tạo QR code CSS, sử dụng Header QR code CSS
Hướng dẫn thực hành Header notification CSS
Hướng dẫn tạo Header notification CSS - Phần 2
Hướng dẫn thực hành tạo Header notification CSS - Phần 3
Hướng dẫn thực hành Header notification CSS - Phần 4
52. Base modal 12 phút 13 giây
Tìm hiểu modal trong CSS, tạo Modal trong CSS
53. Dựng khung form đăng ký 16 phút 42 giây
Dựng form đăng ký trong HTML CSS
54. CSS form đăng ký 26 phút 58 giây
CSS form đăng ký
55. CSS form đăng ký - Phần 2 26 phút 14 giây
Cách CSS form đăng ký - Phần 2
Cách viết CSS form đăng nhập
57. Modal animation 6 phút 15 giây
Cách viết Modal animation
58. Dựng khung tìm kiếm 19 phút 53 giây
Thực hành dựng form tìm kiếm CSS
59. Header tìm kiếm CSS 40 phút 3 giây
Thực hành Header tìm kiếm CSS
60. Lịch sử tìm kiếm CSS 23 phút 46 giây
Thực hành với Lịch sử tìm kiếm CSS
61. Header cart badge 10 phút 46 giây
Thực hành tạo Header cart badge
62. Header giỏ hàng trống CSS 25 phút 55 giây
Thực hành với Header giỏ hàng trống CSS
63. Header cart - List products 35 phút 19 giây
Thực hành tạo Header cart - List products
64. Header user info 28 phút 5 giây
Thực hành tạo Header user info
65. Header fix ui bugs 16 phút 40 giây
Thực hành Header fix ui bugs
66. Dựng khung phần danh mục 14 phút 53 giây
Thực hành Dựng khung phần danh mục
67. Danh mục - base responsive 10 phút 53 giây
Thực hành Danh mục - base responsive
68. Danh mục CSS 21 phút 49 giây
Thực hành tạo Danh mục CSS
Thực hành Dựng khung: Sắp xếp, lọc sản phẩm
Viết thực hành CSS: Sắp xếp, lọc sản phẩm
71. Dựng khung sản phẩm 18 phút 12 giây
Thực hành Dựng khung sản phẩm với CSS
72. Sản phẩm CSS - Phần 1 25 phút 26 giây
Tạo Sản phẩm CSS - Phần 1, tực hành mục sản phẩm
73. Sản phẩm CSS - Phần 2 18 phút 41 giây
Thực hành Sản phẩm CSS - Phần 2
74. Sản phẩm CSS - Phần 3 13 phút 40 giây
Thực hành Sản phẩm CSS - Phần 3
Thực hành mục Sản phẩm: CSS nhãn yêu thích
Thực hành mục Sản phẩm: CSS nhãn giảm giá
Thực hành: Hoàn thiện mục sản phẩm với CSS
78. Fix UI bugs - Phần 2 35 phút 10 giây
Thực hành Fix UI bugs - Phần 2
79. Pagination UI 14 phút 45 giây
Thực hành phân trang Pagination UI
80. Dựng khung footer 16 phút 7 giây
Thực hành Dựng khung footer
81. Footer CSS 27 phút
Thực hành với Footer CSS
82. Chương cuối HTML, CSS 2 phút 53 giây
Chương cuối HTML, CSS | Công Tác Chuẩn Bị Làm Dự Án Cuối Khoá
Giới thiệu dự án The Band | Thực hành cắt HTML CSS cơ bản | Phân tích giao diện web
02. Phân biệt & gọi tên các thành phần
85. 03. Phân tích dự án 7 phút 31 giây
03. Phân tích dự án - Thực hành phân tích dự án
04. Tạo khung dự án The Band | Dựng project base | Khóa học HTML, CSS cơ bản cho người mới bắt đầu
87. 05. Header CSS 33 phút 49 giây
Thực hành 05. Header CSS
88. 06. Navigation CSS 28 phút 45 giây
Thực hành menu với Navigation CSS
89. 07. Header search CSS 20 phút 10 giây
Thực hành bài 07. Header search CSS
90. 08. Header fixed CSS 7 phút 19 giây
Thực hành 08. Header fixed CSS
91. 09. Slider CSS 27 phút 21 giây
Thực hành 09. Slider CSS
92. 10. About section CSS 17 phút 47 giây
Thực hành 10. About section CSS
93. 11. Team section CSS 14 phút 7 giây
Thực hành 11. Team section CSS
94. 12. Tour tickets CSS 19 phút 27 giây
Thực hành 12. Tour tickets CSS
95. 13. Tour places CSS 24 phút 9 giây
Thực hành 13. Tour places CSS
Thực hành 13.1. Buy Tickets Modal (video bổ sung)
97. 14. Row - columns layout 15 phút 25 giây
Thực hành 14. Row - columns layout
98. 15. Contact form CSS 24 phút 14 giây
Thực hành 15. Contact form CSS
99. 16. Map & footer CSS 15 phút 9 giây
Thực hành 16. Map & footer CSS
100. 17. Review 6 phút 23 giây
17. Review lại dự án
101. 18. Responsive là gì? 5 phút 50 giây
Tìm hiểu Responsive là gì? Responsive trong CSS
102. 19. Media queries? 15 phút 38 giây
Media queries trong CSS, @media css là gì
103. 20. Tablet responsive 9 phút 47 giây
Tablet responsive là gì, lam sao responsive Table
104. 21. Mobile menu responsive 35 phút 39 giây
Thực hành tạo Mobile menu responsive, cách tạo menu mobile responsive
105. 22. Mobile menu fix bug 12 phút 37 giây
Thực hành Mobile menu fix bug
106. 23. Mobile fix bug submenu 20 phút 18 giây
Thực hành Mobile fix bug submenu
107. 24. Content responsive 14 phút 43 giây
Thực hành làm Content responsive trong CSS
108. 25. Contact form responsive 13 phút 41 giây
Thực hành Contact form responsive
109. 26. Review 21 phút 25 giây
Review lại dự án
110. 27. Run and fix bug on mobile 17 phút 1 giây
Thực hành: Run and fix bug on mobile
111. 28. Fix bugs 17 phút 2 giây
Fix bugs dự án
Thực hành Buy Tickets Modal Javascript Logic (video bổ sung)

Từ khóa:f8, f8 html, f8 css, f8 học html css, f8 fullstack, f8 html css cơ bản, f8 html, f8 css, f8 lập trình web, f8 học lập trình web