How To Set Cell Width And Height In HTML? - Tutorialspoint

Trang chủ » Html Table Td Column Width » How To Set Cell Width And Height In HTML? - Tutorialspoint

Có thể bạn quan tâm

How to set cell width and height in HTML? HTMLWeb DevelopmentFront End Technology

We use the inline CSS style, to set the cell width and height.

The HTML style element contains width and height attributes. To set cell width and height we should place these attributes with specified values with pixels inside the <td> tag.

Syntax

Following is the syntax to set cell width and height in HTML.

<td style="width: 20px;height: 40px">content</td>

Example

Following is the example program to set cell width and height in HTML.

<!DOCTYPE html> <html> <style> table,tr,th,td { border:1px solid black; } </style> <body> <h2>Tables in HTML</h2> <table style="width: 100%"> <tr> <th >Name </th> <th>Job role</th> </tr> <tr> <td style="width: 20px;height: 40px">Tharun</td> <td >Content writer</td> </tr> <tr> <td>Akshaj</td> <td >Content writer</td> </tr> </table> </body> </html>

In above example we tried to set width and height of the first-row cells of the table.

Example

Following is the example program to set cell width and height in HTML.

<!DOCTYPE html> <html> <style> table,tr,th,td { border:1px solid black; } </style> <body> <h2>Tables in HTML</h2> <table style="width: 100%"> <tr> <th >Name </th> <th>Job role</th> </tr> <tr> <td style="width: 20px;height: 40px">Tharun</td> <td >Content writer</td> </tr> <tr> <td style="width: 20px;height: 40px" >Akshaj</td> <td >Content writer</td> </tr> </table> </body> </html>

In above example we tried to set width and height of the first all the rows cells of the table.

Example

Following is the example program to set cell width and height in HTML.

<!DOCTYPE html> <html> <style> table,tr,th,td { border:1px solid black; } </style> <body> <h2>Tables in HTML</h2> <table style="width: 100%"> <tr> <th>Name </th> <th>Job role</th> </tr> <tr> <td style="width: 20px;height: 40px">Tharun</td> <td style="width: 20px;height: 40px">Content writer</td> </tr> <tr> <td style="width: 20px;height: 40px" >Akshaj</td> <td style="width: 20px;height: 40px">Content writer</td> </tr> </table> </body> </html>

Lokesh Badavath Lokesh Badavath Updated on: 10-Sep-2023

39K+ Views

Từ khóa » Html Table Td Column Width