HocKhaThư viện lời giải bài tập

Giải Tin học 12 - Định hướng khoa học máy tính trang 56

Lời giải chi tiết SGK Lớp 12 · Môn Tin Học · Trang 56–57

Hai trang này thuộc Bài 9 – chủ yếu là phần lý thuyết về tạo bảng (table) trong HTML, một câu hỏi suy nghĩ, và phần thực hành tạo danh sách. Không có bài tập trắc nghiệm, nên mình sẽ tóm tắt lý thuyết gọn rồi giải kỹ câu hỏi và nhiệm vụ thực hành.

Tóm tắt lý thuyết

Cấu trúc cơ bản của một bảng HTML:

ThẻVai trò
Khai báo cả bảng
Một hàng (table row)
Ô tiêu đề (in đậm, căn giữa)
Ô dữ liệu thường (table data)

Các định dạng làm bảng đẹp và dễ đọc hơn:

  • Thêm tiêu đề: dùng
, đặt ngay sau và trước đầu tiên.
  • Tạo khung bảng: dùng thuộc tính con border trong style, theo cú pháp:

    • ```
    "độ_dày_theo_px kiểu_viền [màu_viền]"
    ```

    Trong đó hai thuộc tính đầu là bắt buộc. kiểu_viền nhận một trong bốn giá trị: solid, dotted, double, none. màu_viền mặc định là màu đen, có thể bỏ qua.

    • Điều chỉnh kích thước: dùng width và height trong style, đặt theo tỉ lệ phần trăm (%) hoặc số điểm ảnh (px). Nên ưu tiên dùng % vì các thiết bị có kích thước màn hình khác nhau.
    • Gộp ô: dùng rowspan (gộp theo hàng) và colspan (gộp theo cột). Ô gộp sẽ mở rộng sang các hàng/cột lân cận. Với hàng tiếp theo đã bị gộp, ta bỏ qua cặp thẻ
    / ở vị trí tương ứng.

    Ghi nhớ: Phần tử bảng được tạo bởi các thẻ chính

    , ,
    , ; trình bày bảng bằng thuộc tính style.

    Câu hỏi: Nhược điểm của bảng ở Hình 9.6

    Đề bài: "Bảng trong ví dụ trên Hình 9.6 có nhược điểm gì? Cần làm thế nào để giải quyết nhược điểm đó?"

    Trả lời:

    • Nhược điểm: Bảng ở Hình 9.6 chưa có khung viền (chưa nhìn rõ ranh giới các ô), và khi gộp ô bằng rowspan, colspan thì cấu trúc HTML trở nên phức tạp, dễ nhầm lẫn khi đếm và kiểm soát số lượng ô trên mỗi hàng (vì các hàng bị gộp sẽ thiếu một số thẻ
    		/).
  • Cách khắc phục:
  • Thêm khung viền cho bảng để dễ đọc, ví dụ dùng style="border: 1px solid" cho table, th, td.
  • Khi gộp ô cần ghi chú/đánh dấu cẩn thận để không bỏ sót hoặc thừa thẻ. Có thể canh lề, viết thụt dòng cho mã HTML gọn gàng, và kiểm tra lại tổng số cột trên từng hàng cho khớp.

    • Nhiệm vụ 1: Tạo danh sách

    Đề bài: Viết đoạn mã HTML để tạo danh sách các câu lạc bộ của trường như Hình 9.7.

    Sách hướng dẫn theo 4 bước:

    • Bước 1: Văn bản gồm hai phần — một tiêu đề và một danh sách lồng nhau.
    • Bước 2: Tạo tiêu đề bằng

      ...

      .
    • Bước 3: Tạo danh sách không có thứ tự bằng
        với các mục
      • .
      • Bước 4: Trong mỗi mục lớn (THỂ THAO, NGHỆ THUẬT), thêm một danh sách có thứ tự
          ở giữa cặp thẻ
        1. . Mục con cấp ba (như Karatedo, Taekwondo...) lại là một
            lồng tiếp.

      Dưới đây là đoạn mã hoàn chỉnh tạo đúng nội dung Hình 9.7:

      Danh sách Câu lạc bộ
      

        
    
      • THỂ THAO
        
          
            
        1. Bóng đá
          2. 
            
        2. Bóng chuyền
          3. 
            
        3. Bóng rổ
          4. 
            
        4. Võ
                
            
                    
          1. Karatedo
            2. 
                    
          2. Taekwondo
            3. 
                    
          3. Vovinam
            4. 
                
          
            
          5. 
            
        5. Bơi
          6. 
        
        
    
        • 
    
      • NGHỆ THUẬT
        
          
            
        1. Mĩ thuật
          2. 
            
        2. Nhiếp ảnh
          3. 
            
        3. Âm nhạc
                
            
                    
          1. Thanh nhạc
            2. 
                    
          2. Piano
            3. 
                    
          3. Violin
            4. 
                
          
            
          4. 
            
        4. Khiêu vũ
          5. 
        
        
    
        •

      Giải thích các điểm mấu chốt:

        • (unordered list) tạo danh sách dùng dấu chấm tròn cho hai mục lớn THỂ THAO và NGHỆ THUẬT.
          • (ordered list) tạo danh sách đánh số 1, 2, 3... cho các môn bên trong.
          1. Danh sách con cấp ba (Karatedo, Taekwondo, Vovinam và Thanh nhạc, Piano, Violin) trong Hình 9.7 được đánh thứ tự bằng chữ cái a, b, c — nên mình thêm type="a" cho
              đó.
            1. Điểm quan trọng nhất là danh sách lồng nhau: cặp thẻ
                con phải nằm bên trong cặp thẻ
              1. của mục cha (ví dụ
                  của Võ nằm trong
                1. Võ ...
                  2. ), thì trình duyệt mới hiển thị đúng cấu trúc phân cấp.

        Nếu bạn muốn, mình có thể giải tiếp phần bài tập cuối Bài 9 (nếu nó nằm ở các trang sau) hoặc viết thêm phần thực hành tạo bảng.

        Chế độ đọc sách →