Up5me
Trang chủ > Câu hỏi lẻ > UkuWJreX24jG

Đề bài

Thầy giáo yêu cầu một nhóm học sinh làm một trang web hiển thị danh sách điểm để học sinh trong lớp có thể xem điểm trực tuyến như sau:

DANH SÁCH ĐIỂM

Lớp 10A1

(Ghi chú: Nền của dòng đầu tiên trong bảng có màu xanh lá cây)

Sau khi xem danh sách, các học sinh có thảo luận về mã HTML để hiển thị như sau:

1. Để định nghĩa font chữ cho toàn bộ trang web, có thể định nghĩa giá trị cho thuộc tính font-family bằng mã lệnh CSS như sau: body {font: Arial;}
2. Mã lệnh sau đây sẽ cho phép tạo ra bảng có số dòng, số cột như yêu cầu:<table><tr><th>{Ô 1}</th><th>{Ô 2}</th><th>{Ô 3}</th></tr> <tr><td>{Ô 4}</td> <td>{0 5}</td> <td>{Ô 6}</td> </tr> <tr><td>{Ô 7}</td> <td>{0 8}</td> <td>{Ô 9}</td></tr> <tr><td>{Ô 10}</td> <td>{Ô 11} </td><td>{Ô 12)</td></tr> <tr><td>{Ô 13)</td><td>{Ô 14}</td> <td>{Ô 15}</td> </tr> </table>
3. Để định dạng màu sắc các dòng của bảng, sử dụng mã lệnh CSS như sau: tr {background-color: #F2F2F2;}th {text-align: center;background-color: #04AA6D;color: #FFFFFF;}
4. Để định dạng màu sắc, độ rộng biên của bảng, sử dụng mã lệnh CSS như sau: td, th {border: 1px solid #ddd;}
Đáp án đúng: 1S, 2Đ, 3Đ, 4Đ

Xem lời giải

Phương pháp giải

Lời giải chi tiết

Hãy đánh giá từng mã lệnh HTML và CSS được nêu ra từ các bạn học sinh:

  1. Định nghĩa font chữ: body {font: Arial;} không chính xác do cách viết không đúng. Nên sử dụng: body {font-family: Arial;}
  2. Mã lệnh tạo bảng: Cấu trúc bảng HTML cơ bản đúng nhưng có lỗi nhỏ là "Ô" phải thay bằng dữ liệu thực tế. Bên cạnh đó, định dạng chỉ có 4 hàng dữ liệu, không phù hợp với bảng trong hình. Mã đúng nên như sau: 
    
    <table>
        <tr>
            <th>STT</th>
            <th>Họ tên</th>
            <th>Điểm</th>
        </tr>
        <tr>
            <td>1</td>
            <td>Bùi Hoàng Việt Anh</td>
            <td>9</td>
        </tr>
        <tr>
            <td>2</td>
            <td>Vũ Văn Thanh</td>
            <td>8</td>
        </tr>
        <tr>
            <td>3</td>
            <td>Nguyễn Tiến Linh</td>
            <td>7</td>
        </tr>
        <tr>
            <td>4</td>
            <td>Nguyễn Văn Toàn</td>
            <td>8</td>
        </tr>
    </table>
  3. Mã lệnh định dạng màu sắc dòng: tr {background-color: #F2F2F2;} th {text-align: center; background-color: #04AA6D; color: #FFFFFF;} đúng cho việc định dạng màu nền cho dòng tiêu đề. Tuy nhiên, để chỉ áp dụng màu nền cho dòng tiêu đề, chỉ cần định nghĩa cho th.
  4. Mã định dạng biên của bảng: td, th {border: 1px solid #ddd;} là đúng, định dạng biên cho các ô trong bảng.

Chú ý khi giải

  • Chú ý các giá trị CSS cần được viết đúng cú pháp để trang web hiển thị đúng định dạng mong muốn.
  • Font chữ cần được định nghĩa chính xác với thuộc tính font-family.
  • Bảng cần thiết lập đúng số dòng và số cột trước khi đưa vào nội dung để tránh lỗi về cấu trúc HTML.
  • Chỉ cần định dạng phần tiêu đề bằng <th> để đảm bảo dòng đầu tiên có màu nền xanh lá cây.
(0)
Đang Quan Tâm