How to set cell width and height in HTML?-HTML Tutorial-php.cn

How to set cell width and height in HTML?

WBOY

Release： 2023-09-03 22:25:02

forward

2752 people have browsed it

How to set cell width and height in HTML?

We use inline CSS styles to set the width and height of the cell.

HTML style elements contain width and height attributes. To set the width and height of a cell, we should place these properties inside

tags with specified values and pixels.

grammar

The following is the syntax for setting cell width and height in HTML.

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

Copy after login

Example

The following is a sample 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>

Copy after login

In the above example, we try to set the width and height of the cells in the first row of the table.

Example

The following is a sample 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>

Copy after login

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

Example

The following is a sample 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>

Copy after login

The above is the detailed content of How to set cell width and height in HTML?. For more information, please follow other related articles on the PHP Chinese website!