Thứ Sáu, 13 tháng 12, 2013
HTML Tables
HTML Bảng Ví dụ:
| Tên đầu tiên | Họ | Điểm |
|---|---|---|
| Jill | Smith | 50 |
| Eve | Jackson | 94 |
| John | Doe | 80 |
| Adam | Johnson | 67 |
HTML Tables
Bảng được định nghĩa bởi thẻ <table>.
Một bảng được chia thành các hàng (với thẻ <tr>), và mỗi hàng được chia thành các tế bào dữ liệu (với thẻ <td>). td viết tắt của "bảng dữ liệu," và giữ nội dung của một ô. Một thẻ <td> có thể chứa văn bản, liên kết, hình ảnh, danh sách, mẫu biểu, bảng khác, vv
Ví dụ bảng
<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
Làm thế nào các mã HTML trên trông trong một trình duyệt:
| dòng 1, tế bào 1 | hàng 1, 2 tế bào |
| dòng 2, tế bào 1 | dòng 2, tế bào 2 |
HTML Tables và các thuộc tính biên giới
Nếu bạn không chỉ định một thuộc tính biên giới, bảng sẽ được hiển thị không biên giới. Đôi khi điều này có thể hữu ích, nhưng hầu hết thời gian, chúng tôi muốn biên giới để hiển thị.
Hiển thị một bảng với biên giới, xác định thuộc tính biên giới:
<table border="1">
<tr>
<td>Row 1, cell 1</td>
<td>Row 1, cell 2</td>
</tr>
</table>
<tr>
<td>Row 1, cell 1</td>
<td>Row 1, cell 2</td>
</tr>
</table>
HTML Bảng Headers
Thông tin tiêu đề trong bảng được định nghĩa bởi thẻ <th>.
Tất cả các trình duyệt hiển thị văn bản trong các yếu tố <th> như táo bạo và trung tâm.
<table border="1">
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
Làm thế nào các mã HTML trên trông trong trình duyệt của bạn:
| Tiêu đề 1 | Tiêu đề 2 |
|---|---|
| dòng 1, tế bào 1 | hàng 1, 2 tế bào |
| dòng 2, tế bào 1 | dòng 2, tế bào 2 |
Đăng ký:
Đăng Nhận xét (Atom)
Không có nhận xét nào:
Đăng nhận xét