Scribd
Upload
11 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.

Uploaded by

amitakhare092
Copyright
© © All Rights Reserved
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
11 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.

Uploaded by

amitakhare092
Copyright
© © All Rights Reserved
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

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>

You might also like