Để gộp ô trong HTML, hãy dùng thuộc tính colspan và rowspan. rowspan chỉ định số hàng một ô trải rộng, colspan chỉ định số cột một ô trải rộng.
Cả hai thuộc tính đều đặt bên trong thẻ <td>. Giá trị là số, ví dụ: 2 cho 2 hàng (rowspan), 2 cho 2 cột (colspan).
Ví dụ 1: Bảng 3x3 bình thường
<!DOCTYPE html> <html> <head> <style> table, th, td { border: 1px solid black; width: 100px; height: 50px; } </style> </head> <body> <h1>Heading</h1> <table> <tr> <th></th> <th></th> <th></th> </tr> <tr> <td></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> </tr> </table> </body> </html>
Kết quả
Ví dụ 2: Gộp ô với colspan và rowspan
<!DOCTYPE html> <html> <head> <style> table, th, td { border: 1px solid black; width: 100px; height: 50px; } </style> </head> <body> <h1>Heading</h1> <table> <tr> <th colspan="2"></th> <th></th> </tr> <tr> <td></td> <td></td> <td rowspan="2"></td> </tr> <tr> <td></td> <td></td> </tr> </table> </body> </html>
Kết quả