Thẻ thead trong HTML

Thẻ thead trong HTML

Thẻ thead trong HTML dùng để chứa tiêu đề của các cột trong bảng, trong thẻ thead chứa thẻ tr và thẻ th, chi tiết như nào hãy cùng chúng tôi phân tích:

Chức năng của Thẻ thead trong HTML

Thẻ thead trong HTML dùng để chứa tiêu đề của các cột trong bảng, trong thẻ thead chứa thẻ tr và thẻ th.

Cú pháp của Thẻ thead trong HTML

<thead>thehtmlcon</thead>

thehtmlcon: Thẻ HTML con bao gồm thẻ tr và thẻ th.

Bao gồm thẻ mở <thead> và thẻ đóng </thead> bao quanh thẻ tr và thẻ th.

Code Thẻ thead trong HTML

Code một phần

<thead>
    <tr>
      <th>STT</th>
      <th>Họ Tên</th>
      <th>Lương</th>
    </tr>
</thead>

Code hoàn chỉnh

<!DOCTYPE html>
<html>
<head>
<title>Thẻ thead trong HTML</title>
<style>
table{width:100%;border-collapse: collapse; font-family: sans-serif; font-size: 15px; letter-spacing: 1px;}
table, th, td { border:1px solid black; }
td, th {text-align: left; padding: 8px; }
caption{padding: 8px;text-transform: uppercase;font-size:18px;font-weight:bold}
tr:nth-child(even) { background-color: #dddddd; }
</style>
</head>
<body>
<table>
 <caption> Bảng Lương</caption>
  <thead>
    <tr>
      <th>STT</th>
      <th>Họ Tên</th>
      <th>Lương</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>1</td>
      <td>Bùi Tấn Lực</td>
      <td>20.000.000VNĐ</td>
    </tr>
    <tr>
      <td>2</td>
      <td>Trần Thị Vân</td>
      <td>25.000.000VNĐ</td>
    </tr>
   <tr>
      <td>3</td>
      <td>Nguyễn Thùy Dung</td>
      <td>20.000.000VNĐ</td>
    </tr>
   <tr>
      <td>4</td>
      <td>Trần Ngọc Thanh</td>
      <td>20.000.000VNĐ</td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <th colspan= "2">Tổng Lương</th>
      <td>85.000.000VNĐ</td>
    </tr>
  </tfoot>
</table>
</body>
</html>

Kết quả:

Bảng Lương
STT Họ Tên Lương
1 Bùi Tấn Lực 20.000.000VNĐ
2 Trần Thị Vân 25.000.000VNĐ
3 Nguyễn Thùy Dung 20.000.000VNĐ
4 Trần Ngọc Thanh 20.000.000VNĐ
Tổng Lương 85.000.000VNĐ

Chạy Thử

Lời kết

Cảm ơn các bạn đã tham khảo bài viết Thẻ thead trong HTML.

  • ★★★★★ ★★★★★
  • 0 Bình luận
CEO Bùi Tấn Lực
Bùi Tấn Lực
CEO Bùi Tấn Lực người sáng lập ra Web Mới, là một lập trình viên website, người viết content, chuyên tư vấn các vấn đề về website và SEO website
Chia sẻ nội dung đánh giá của bạn về Thẻ thead trong HTML
Email, Điện thoại của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *
Đánh giá của bạn
Tên *
Email
Số điện thoại *
Bình luận, Hỏi đáp
Đăng ký tư vấn thiết kế website
Tìm hiểu 1 năm không bằng lắng nghe 1 câu tư vấn