1. Giới thiệu, cài đặt, cấu hình môi trường lập trình 2
    1. Cài đặt trình soạn thảo code Visual Studio Code IDE#2594
    2. Cài đặt tiện ích mở rộng Live Server Extension cho Visual Studio Code#10229
  2. HTML5 là gì? Các thẻ (tag) HTML cơ bản 19
    1. HTML là gì? Cú pháp sử dụng thẻ (tag) trong HTML#37
    2. Khác biệt giữa HTML và HTML5#2623
    3. Cấu trúc file HTML5 cơ bản#32
    4. Các Quy tắc và Quy ước nên tuân theo khi lập trình web HTML5 CSS JS#10192
    5. Các thói quen cần có khi lập trình web sử dụng HTML#38
    6. Các thẻ (tag) định nghĩa mô tả (meta) cho trang web#2614
    7. Các thẻ (tag) định dạng Đề mục (Heading), Phân đoạn (Paragraph), Ngắt dòng (Break) cho văn bản (Text)#10249
    8. Các thẻ (tag) tạo đường kẻ ngang (Horizontal Rule)#10242
    9. Các thẻ (tag) định dạng kiểu font chữ#33
    10. Các thẻ (tag) định dạng hiển thị cho văn bản (text)#10260
    11. Phân biệt 2 họ font chữ phổ biến SERIF và SANS SERIF#10256
    12. Các thẻ (tag) tạo Siêu liên kết (hyperlink)#2615
    13. Các thẻ (tag) tạo Danh sách (list)#2618
    14. Các thẻ (tag) chèn hình ảnh vào trang web#10276
    15. Các thẻ (tag) chèn các đối tượng đa phương tiện (audio, video) vào trang web#9589
    16. Các thẻ (tag) làm thanh tự động cuộn nội dung trong trang web#9611
    17. Các ký tự đặc biệt trong HTML#2636
    18. Thẻ (tag) IFRAME để nhúng trang web khác vào trang web của mình#9996
    19. Các loại font chữ phổ biến trong thiết kế web SERIF, SANS SERIF, DISPLAY, HANDWRITING, MONOSPACE#10314
  3. Thiết kế bố cục trang web (layout) 12
    1. Thẻ TABLE (TABLE tag) là gì?#39
    2. Thiết kế bố cục trang web sử dụng thẻ TABLE (TABLE tag)#35
    3. Bài tập - Thiết kế bố cục trang web sử dụng thẻ TABLE (TABLE tag) - Đơn giản#9102
    4. Bài tập - Thiết kế bố cục trang web sử dụng thẻ TABLE (TABLE tag) - Web Bán hàng - Trang chủ#8499
    5. Bài tập - Thiết kế bố cục trang web sử dụng thẻ TABLE (TABLE tag) - Web Bán hàng - Trang Giới thiệu#8500
    6. Bài tập - Thiết kế bố cục trang web sử dụng thẻ TABLE (TABLE tag) - Web Bán hàng - Trang Liên hệ#8501
    7. Bài tập - Thiết kế bố cục trang web sử dụng thẻ TABLE (TABLE tag) - Web Bán hàng - Trang Danh sách Sản phẩm#8502
    8. Bài tập - Thiết kế bố cục trang web sử dụng thẻ TABLE (TABLE tag) - Web Bán hàng - Trang Sản phẩm chi tiết#8504
    9. Bài tập - Thiết kế bố cục trang web sử dụng thẻ TABLE (TABLE tag) - Web Bán hàng - Trang Giỏ hàng#8506
    10. Bài tập - Thiết kế bố cục trang web sử dụng thẻ TABLE (TABLE tag) - Web Bán hàng - Trang Tìm kiếm#8509
    11. Thẻ DIV (DIV tag) là gì?#36
    12. Thiết kế bố cục trang web sử dụng thẻ DIV (DIV tag)#34
  4. Tạo biểu mẫu nhập liệu sử dụng thẻ (tag) FORM 21
    1. Biểu mẫu nhập liệu (form) là gì? Thường được sử dụng vào mục đích gì?#44
    2. Tạo ô nhập liệu INPUT 1 dòng (single line text)#45
    3. Tạo ô nhập liệu TEXTAREA nhiều dòng (multiline text)#46
    4. Tạo ô nhập liệu INPUT dạng ẩn (hidden)#47
    5. Tạo nút bấm BUTTON#51
    6. Tạo ô nhập liệu CHECKBOX chọn 1 hoặc nhiều những tùy chọn#49
    7. Tạo ô nhập liệu RADIO chọn 1 trong những tùy chọn#48
    8. Tạo ô nhập liệu SELECT cho phép chọn lựa tùy chọn#50
    9. Tạo ô nhập liệu INPUT kiểu COLOR#59
    10. Tạo ô nhập liệu INPUT kiểu DATE#57
    11. Tạo ô nhập liệu INPUT kiểu EMAIL#52
    12. Tạo ô nhập liệu INPUT kiểu NUMBER#55
    13. Tạo ô nhập liệu INPUT kiểu RANGE#56
    14. Tạo ô nhập liệu INPUT kiểu TEL (số điện thoại)#54
    15. Tạo ô nhập liệu INPUT kiểu TIME#58
    16. Tạo ô nhập liệu INPUT kiểu URL#53
    17. Tạo thanh đo lường METER#61
    18. Tạo thanh tiến trình PROGRESS#60
    19. Tạo biểu mẫu (Form) đặt vé Máy bay#2641
    20. Tạo biểu mẫu (Form) Đăng nhập#2642
    21. Tạo biểu mẫu (Form) Đăng ký#2643
  5. CSS là gì? 34
    1. CSS là gì? Cú pháp sử dụng CSS#62
    2. Các cách áp dụng CSS để định dạng trang web#40
    3. Các thuộc tính CSS định dạng font chữ#41
    4. Các thuộc tính CSS quy định màu sắc đối tượng#42
    5. Đơn vị đo lường trong CSS#43
    6. Bài tập - Tạo menu ngang đa cấp bằng CSS#8796
    7. Các thuộc tính quy định Kích thước và Khoảng cách của các phần tử#9153
    8. Tìm hiểu về Thuộc tính vị trí Position trong CSS#8923
    9. Tìm hiểu các thuộc tính quy định vị trí Trôi nổi, Dàn hàng ngang sử dụng Float Left, Float Right trong CSS#9724
    10. Thiết kế bố cục trang web sử dụng thẻ DIV (DIV tag), thuộc tính CSS Float left, right và kỹ thuật sử dụng điểm ngắt CSS class clear-fix#9733
    11. Bài tập - Thiết kế bố cục trang web sử dụng thẻ DIV (DIV tag) - Header phong cách 1#9437
    12. Bài tập - Thiết kế bố cục trang web sử dụng thẻ DIV (DIV tag) - Header phong cách 2#9458
    13. Bài tập - Thiết kế bố cục trang web sử dụng thẻ DIV (DIV tag) - Header phong cách 3#9459
    14. Bài tập - Thiết kế bố cục trang web sử dụng thẻ DIV (DIV tag) - Call for Action#9462
    15. Bài tập - Thiết kế bố cục trang web sử dụng thẻ DIV (DIV tag) - Feature Product#9464
    16. Bài tập - Thiết kế bố cục trang web sử dụng thẻ DIV (DIV tag) - Services#9466
    17. Bài tập - Thiết kế bố cục trang web sử dụng thẻ DIV (DIV tag) - Our Team#9467
    18. Bài tập - Thiết kế bố cục trang web sử dụng thẻ DIV (DIV tag) - Experience#9470
    19. Bài tập - Thiết kế bố cục trang web sử dụng thẻ DIV (DIV tag) - Our Portfolio phong cách 1#9473
    20. Bài tập - Thiết kế bố cục trang web sử dụng thẻ DIV (DIV tag) - Our Portfolio phong cách 2#9475
    21. Bài tập - Thiết kế bố cục trang web sử dụng thẻ DIV (DIV tag) - Our Portfolio phong cách 3#9476
    22. Bài tập - Thiết kế bố cục trang web sử dụng thẻ DIV (DIV tag) - Statistic#9480
    23. Bài tập - Thiết kế bố cục trang web sử dụng thẻ DIV (DIV tag) - Testimonials#9482
    24. Bài tập - Thiết kế bố cục trang web sử dụng thẻ DIV (DIV tag) - Pricing Tables#9484
    25. Bài tập - Thiết kế bố cục trang web sử dụng thẻ DIV (DIV tag) - Get in touch phong cách 1#9486
    26. Bài tập - Thiết kế bố cục trang web sử dụng thẻ DIV (DIV tag) - Get in touch phong cách 2#9487
    27. Bài tập - Thiết kế bố cục trang web sử dụng thẻ DIV (DIV tag) - Footer#9490
    28. Bộ lựa chọn đặc biệt theo trạng thái Pseudo Class và Pseudo Element trong CSS#9754
    29. Bộ lựa chọn trong CSS (CSS Selector)#10020
    30. Sử dụng CSS để làm nhà sáng tạo Nghệ thuật sắp xếp trình bày chữ Typography#10155
    31. Hướng dẫn phân tích Bố cục (layout) Web bán hàng Thực phẩm Dinh dưỡng Organic#10330
    32. Tư duy Thiết kế Khung cần có khi xây dựng giao diện Một Trang web#10344
    33. Tìm hiểu toàn diện về thuộc tính trình diễn ảnh object-fit trong CSS#11632
    34. Bài tập - Thiết kế mẫu hóa đơn bán hàng cho máy in nhiệt khổ giấy K80 và K57#12222
  6. Javascript căn bản 8
    1. Javascript là gì? Ứng dụng của Javascript#2692
    2. Các cách sử dụng Javascript trong trang web#2693
    3. Biến trong Javascript#2694
    4. Hàm trong Javascript#2695
    5. Lab 01 - tạo chương trình tính toán cơ bản#7864
    6. Bài tập Ghép chuỗi String#8156
    7. Cấu trúc điều khiển sử dụng IF ELSE#8896
    8. Cách lấy dữ liệu Người dùng từ Biểu mẫu (FORM)#2696
  7. JQuery căn bản 10
    1. Giới thiệu JQuery và ứng dụng của JQuery trong thiết kế, lập trình web#8243
    2. Cú pháp của JQUERY và cách sử dụng JQUERY trong trang web#8245
    3. Tìm hiểu quy tắc vận hành của JQUERY#8244
    4. Toàn tập về Bộ lựa chọn (selector)#8248
    5. Bài tập Tạo trang tùy chỉnh Nội dung và Giao diện bằng JQUERY#8995
    6. Bài tập Thực thi một hàm xử lý sau một khoảng thời gian bằng hàm setTimeout#8996
    7. Bài tập Thực thi một hàm xử lý liên tục sau 1 khoảng thời gian bằng hàm setInterval#9020
    8. Thu thập dữ liệu người dùng nhập trong FORM bằng JQUERY#9033
    9. Tích hợp bộ công cụ Soạn thảo văn bản Trực quan WYSIWYG CKEDITOR#9037
    10. Tích hợp công cụ chọn Ngày Tháng Date Picker#9040
  8. Bootstrap là gì? JQuery là cái chi? 8
    1. Giới thiệu Bootstrap#2698
    2. Cách sử dụng Bootstrap trong dự án của bạn#2699
    3. Hệ thống Lưới (GRID) của Bootstrap#2700
    4. Bài tập - Thiết kế Bố cục (layout) bằng Bootstrap#2701
    5. Ràng buộc dữ liệu (validation) bằng Bootstrap#8270
    6. Bài tập Tổng hợp - Thực hiện Trang web Landing Page giới thiệu Công ty#8332
    7. Thiết kế trang web bố cục (layout) tùy biến theo từng thiết bị màn hình (Responsive)#9805
    8. Tùy biến giao diện theo từng thiết bị màn hình (Responsive) bằng kỹ thuật CSS Media Query#10114
  9. Làm Đồ án Web thực tế Trang bán hàng Nền Tảng phiên bản Bootstrap 14
    1. Lộ trình (Roadmap) Thực hiện Đồ án#10356
    2. Khởi tạo thư mục dự án#2702
    3. Phân tích Bố cục (layout)#2703
    4. Xây dựng Trang chủ (index)#2704
    5. Xây dựng Trang Giới thiệu (about)#2705
    6. Xây dựng Trang Liên hệ (contact)#2706
    7. Xây dựng Trang Danh sách Sản phẩm (products)#2707
    8. Xây dựng Trang Chi tiết Sản phẩm (product_detail)#2708
    9. Xây dựng Trang Giỏ hàng (cart)#2709
    10. Xây dựng Trang Thanh toán (checkout)#2710
    11. Xây dựng Trang Đăng nhập (login)#2711
    12. Xây dựng Trang Đăng ký (register)#2712
    13. Xây dựng Trang Tìm kiếm (search)#2713
    14. Thưởng thức Kết quả (demo version)#2714
  10. Kiểm tra
  11. Tài liệu tham khảo 4
    1. Kho sách, nguồn tài liệu tham khảo Lập trình web Frontend HTML CSS JS#2597
    2. SourceCode tham khảo Lập trình web Frontend HTML CSS JS#2610
    3. Các thể loại Menu trong Thiết kế Web#10110
    4. Tổng hợp các công cụ tự sinh Giao diện HTML, CSS, JS tuyệt vời dành cho Nhà phát triển thiết kế Web#10312
  12. VueJS 7
    1. VueJS là gì? Ứng dụng của VueJS trong phát triển web FrontEnd#8237
    2. Tìm hiểu Kiến trúc Hệ thống Web MVVM - Model View ViewModel#10161
    3. Component trong VueJS#8238
    4. Kiểm tra ràng buộc dữ liệu (validation) bằng VueJS và Bootstrap đơn giản#9406
    5. Kiểm tra ràng buộc dữ liệu (Validation) bằng VueJS và Bootstrap#8354
    6. Bài tập - Sử dụng Bootstrap và VueJS để thiết kế Trang Tuyển dụng các Vị trí Việc làm Công nghệ#8271
    7. Test#8925
  13. UI/UX trong lập trình Web 2
    1. Tìm hiểu về khái niệm UI/UX trong thiết kế ứng dụng#10125
    2. Quy trình Xây dựng, Thiết kế một trang Web#10126
  14. CSS Flexbox 1
    1. Tạo cấu trúc Dòng x Cột trong CSS Flexbox#10341
  15. Extras 2
    1. Bài tập xử lý lưu trữ dữ liệu với LocalStorage#10427
    2. Tạo hiệu ứng chuyển động animation với tính năng motion-path CSS#10482
  16. Video khóa học 1
    1. Video khóa học toàn tập#11572
NenTang.vn

Chương 3-Bài 12. Thiết kế bố cục trang web sử dụng thẻ DIV (DIV tag)

Tác giả: Dương Nguyễn Phú Cường Ngày đăng: 6/9/2025, 19:46 Lượt xem: 676
Về trang chủ Về Khóa học
Bài học trước Bài học tiếp theo
Sản phẩm của Nền tảng NenTang.vn - Hành trang tới Tương lai