Hướng dẫn HTML

TRANG CHỦ HTML Giới thiệu HTML Trình chỉnh sửa HTML HTML cơ bản Phần tử HTML Thuộc tính HTML Tiêu đề HTML Đoạn văn HTML Kiểu HTML Định dạng HTML Trích dẫn HTML Nhận xét HTML Màu HTML HTML CSS Liên kết HTML Hình ảnh HTML HTML Favicon Bảng HTML Danh sách HTML Khối HTML & Nội tuyến Các lớp HTML Id HTML Khung nội tuyến HTML HTML JavaScript Đường dẫn tệp HTML Đầu HTML Bố cục HTML HTML đáp ứng Mã máy tính HTML Ngữ nghĩa HTML Hướng dẫn kiểu HTML Thực thể HTML Biểu tượng HTML Biểu tượng cảm xúc HTML Bộ mã HTML Mã hóa URL HTML HTML so với XHTML

Biểu mẫu HTML

Biểu mẫu HTML Thuộc tính biểu mẫu HTML Phần tử biểu mẫu HTML Các loại đầu vào HTML Thuộc tính đầu vào HTML Thuộc tính biểu mẫu nhập HTML

Đồ họa HTML

HTML Canvas HTML SVG

HTML Media

HTML Media Video HTML Âm thanh HTML Trình cắm HTML HTML YouTube

API HTML

Vị trí địa lý HTML Kéo / thả HTML Lưu trữ web HTML Nhân viên web HTML HTML SSE

Ví dụ HTML

Ví dụ HTML HTML Quiz Bài tập HTML Chứng chỉ HTML Tóm tắt HTML Khả năng truy cập HTML

Tham chiếu HTML

Danh sách thẻ HTML Thuộc tính HTML Thuộc tính toàn cầu HTML Hỗ trợ trình duyệt HTML Sự kiện HTML Màu HTML HTML Canvas HTML Audio / Video HTML Doctypes Bộ ký tự HTML Mã hóa URL HTML Mã HTML Lang Tin nhắn HTTP Phương thức HTTP Công cụ chuyển đổi PX sang EM Các phím tắt bàn phím

Kích thước bảng HTML


Bảng HTML có thể có các kích thước khác nhau cho từng cột, hàng hoặc toàn bộ bảng.


     
     
     
     
     
     
     
     

Sử dụng stylethuộc tính với thuộc tính widthhoặc height để chỉ định kích thước của bảng, hàng hoặc cột.


Chiều rộng bảng HTML

Để đặt chiều rộng của bảng, hãy thêm style thuộc tính vào <table>phần tử:

Thí dụ

Đặt chiều rộng của bảng thành 100%:

<table style="width:100%">
  <tr>
    <th>Firstname</th>
    <th>Lastname</th>
    <th>Age</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
</table>

Lưu ý: Sử dụng phần trăm làm đơn vị kích thước cho chiều rộng có nghĩa là phần tử này sẽ rộng bao nhiêu so với phần tử mẹ của nó, trong trường hợp này là <body> phần tử.


Chiều rộng cột bảng HTML

     
     
     

Để đặt kích thước của một cột cụ thể, hãy thêm style thuộc tính vào một <th>hoặc <td>phần tử:

Thí dụ

Đặt chiều rộng của cột đầu tiên thành 70%:

<table style="width:100%">
  <tr>
    <th style="width:70%">Firstname</th>
    <th>Lastname</th>
    <th>Age</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
</table>


Chiều cao hàng trong bảng HTML

     
     
     

Để đặt chiều cao của một hàng cụ thể, hãy thêm style thuộc tính vào phần tử hàng trong bảng:

Thí dụ

Đặt chiều cao của hàng thứ hai thành 200 pixel:

<table style="width:100%">
  <tr>
    <th>Firstname</th>
    <th>Lastname</th>
    <th>Age</th>
  </tr>
  <tr style="height:200px">
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
</table>

Bài tập HTML

Kiểm tra bản thân với các bài tập

Bài tập:

Sử dụng các kiểu CSS để làm cho bảng có chiều rộng 300 pixel.

<cái bàn>
  <tr>
    <th> Tên </th>
    <th> Họ </th>
    <th> Điểm </th>
  </tr>
  <tr>
    <td> Jill </td>
    <td> Smith < / td>
    <td> 50 </td>
  </tr>
</table>