 | Trong việc thiết kết bảng(table) HTML thì việc gặp các trường hợp phải nối các dòng cells lại để trình trình bày nội dung của bảng một cách logic và chuyên nghiệp. Bài viết này tôi sẽ hướng dẫn cách nối hai ô dạng dòng(merge two column cells). |
Phát thảo thiết kế - Design Sketches:
Mã nguồn - Source code:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<table border="1px" style="width: 100%;">
<tr>
<th>First Name:</th>
<td>Bill Gates</td>
</tr>
<tr>
<th rowspan="2">Telephone:</th>
<td>555 77 854</td>
</tr>
<tr>
<td>555 77 855</td>
</tr>
</table>
</body>
</html>
<html>
<head>
</head>
<body>
<table border="1px" style="width: 100%;">
<tr>
<th>First Name:</th>
<td>Bill Gates</td>
</tr>
<tr>
<th rowspan="2">Telephone:</th>
<td>555 77 854</td>
</tr>
<tr>
<td>555 77 855</td>
</tr>
</table>
</body>
</html>
Kết quả - Result:
| First Name: | Bill Gates |
|---|---|
| Telephone: | 555 77 854 |
| 555 77 855 |
Source: w3schools
No comments:
Post a Comment