PHP前端开发

如何在HTML中设置单元格内边距?

百变鹏仔 4周前 (09-22) #HTML
文章标签 如何在

我们使用内联样式属性,在HTML中设置单元格填充。单元格填充是表格的单元格边框与单元格内内容之间的空间。样式属性用于HTML的

标签内,使用CSS属性padding并指定像素值。

Syntax

Following is the syntax to set cell padding in HTML.

<th style="padding: 40px">table header </th>

Example

的中文翻译为:

示例

Following is an example program to set cell padding in HTML.

<!DOCTYPE html><html><head>   <style>      table, th, td {         border: 1px solid black;      }   </style></head><body>   <h1>Programming Language</h1>   <table>      <tr>         <th style="padding:10px">Language</th>      </tr>      <tr>         <td style="padding:10px">Ruby</td>      </tr>   </table></body></html>

Example

的中文翻译为:

示例

以下是另一个设置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 style="padding: 40px">Name </th>         <th>Job role</th>      </tr>      <tr>         <td>Tharun</td>         <td style="padding: 10px">Content writer</td>      </tr>      <tr>         <td>Akshaj</td>         <td style="padding: 10px">Content writer</td>      </tr>   </table></body></html>

Example

的中文翻译为:

示例

Following is one more example program to set cell padding in HTML.

<!DOCTYPE html><html><head>   <style>      table, th, td {         border: 1px solid black;         border-collapse: collapse;      }      th, td {         padding-top: 10px;         padding-bottom: 20px;         padding-left: 30px;         padding-right: 40px;      }   </style></head><body>   <table style="width:60%">      <tr>         <th>Firstname</th>         <th>Lastname</th>         <th>salary</th>      </tr>      <tr>         <td>John</td>         <td>Smith</td>         <td>50,000</td>      </tr>      <tr>         <td>Eva</td>         <td>Jackson</td>         <td>94,000</td>      </tr>      <tr>         <td>Mike</td>         <td>Doe</td>         <td>80,000</td>      </tr>   </table></body></html>