The document explains how to create HTML tables with borders using both the border attribute and CSS. It also covers attributes like cellpadding and cellspacing for adjusting space within and between cells, as well as how to set table dimensions and use colspan and rowspan for merging cells. Examples are provided to illustrate each concept.
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0 ratings0% found this document useful (0 votes)
8 views2 pages
HTML Table With Border
The document explains how to create HTML tables with borders using both the border attribute and CSS. It also covers attributes like cellpadding and cellspacing for adjusting space within and between cells, as well as how to set table dimensions and use colspan and rowspan for merging cells. Examples are provided to illustrate each concept.
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 2
HTML Table with Border
There are two ways to specify border for HTML tables.
1. By border attribute of table in HTML 2. By border property in CSS HTML Border attribute You can use border attribute of table tag in HTML to specify border. 1. <table border="1"> 2. <tr><th>First_Name</th><th>Last_Name</th><th>Marks</th></tr> 3. <tr><td>Sonoo</td><td>Jaiswal</td><td>60</td></tr> 4. <tr><td>James</td><td>William</td><td>80</td></tr> 5. <tr><td>Swati</td><td>Sironi</td><td>82</td></tr> 6. <tr><td>Chetna</td><td>Singh</td><td>72</td></tr> 7. </table>
First_Name Last_Name Marks
Sonoo Jaiswal 60
James William 80
Swati Sironi 82
Chetna Singh 72
Cellpadding and Cellspacing Attributes
There are two attributes called cellpadding and cellspacing which you will use to adjust the white space in your table cells. The cellspacing attribute defines space between table cells, while cellpadding represents the distance between cell borders and the content within a cell. <table border = "1" cellpadding = "5" cellspacing = "5"> Name Salary Ramesh Raman 5000 Shabbir Hussein 7000
Table Height and Width
You can set a table width and height using width and height attributes. You can specify table width or height in terms of pixels or in terms of percentage of available screen area. <table border = "1" width = "400" height = "150"> Row 1, Column 1 Row 1, Column 2 Row 2, Column 1 Row 2, Column 2 Colspan and Rowspan Attributes You will use colspan attribute if you want to merge two or more columns into a single column. Similar way you will use rowspan if you want to merge two or more rows. <body> <table border = "1"> <tr> <th>Column 1</th> <th>Column 2</th> <th>Column 3</th> </tr> <tr> <td rowspan = "2">Row 1 Cell 1</td> <td>Row 1 Cell 2</td> <td>Row 1 Cell 3</td> </tr> <tr> <td>Row 2 Cell 2</td> <td>Row 2 Cell 3</td> </tr> <tr> <td colspan = "3">Row 3 Cell 1</td> </tr> </table> </body>