Bài 12: Transform và Transition – Hiệu ứng động
Một trang web tĩnh — không có animation hay hiệu ứng — sẽ trông nhàm chán. Nhưng thêm hiệu ứng động nhẹ nhàng sẽ làm trang web trở…
Bài 11: Responsive Design – Media Query
Ngày nay, mọi người truy cập website từ nhiều thiết bị khác nhau: desktop (1920px), tablet (768px), mobile (375px)… Nếu trang web chỉ tối ưu cho desktop, nó…
Bài 10: Positioning – Absolute, Relative, Fixed, Sticky
Cho đến bây giờ, bạn đã học Flexbox và Grid — hai cách sắp xếp bố cục hiện đại. Nhưng đôi khi bạn cần điều khiển chính xác…
Bài 9: CSS Grid – Bố cục 2 chiều
Nếu Flexbox là để sắp xếp items theo một chiều (ngang hoặc dọc), thì CSS Grid là để sắp xếp theo hai chiều (ngang và dọc cùng lúc).…
Bài 8: Flexbox – Bố cục linh hoạt 1 chiều
Trước đây, lập trình viên phải dùng float hoặc position để tạo bố cục trang web — rất phức tạp và dễ gây lỗi. May mắn, Flexbox đã…
Bài 7: Box Model – Margin, Padding, Border, Width
Khi bạn tạo một trang web, mỗi phần tử HTML (heading, paragraph, button…) đều được xem như một “hộp”. Box Model là một trong những khái niệm quan…
Bài 6: CSS là gì? Selector, Property, Value
Ở những bài trước, bạn đã học cách tạo cấu trúc trang web bằng HTML. Nhưng trang web chỉ có HTML sẽ trông rất xấu — tất cả…
Bài 5: Semantic HTML – Thẻ có ý nghĩa (section, article, nav, header, footer)
Cho đến bây giờ, bạn đã biết cách tạo các thẻ HTML cơ bản. Nhưng hầu hết các trang web hiện đại không chỉ dùng <div> mà còn…
Bài 4: Form và Input – Tạo biểu mẫu
Hầu hết các trang web đều có biểu mẫu (form) để người dùng nhập dữ liệu: đăng nhập, đăng ký, liên hệ, tìm kiếm… Bài này sẽ dạy…
Bài 3: Hình ảnh (img), Video (video) và Media
Một trang web chỉ có chữ sẽ rất nhàm chán. Để làm trang web thực sự hấp dẫn, bạn cần chèn hình ảnh, video, và các đa phương…