1

我有一个包含多列的 HTML 表格。

一列可能在表格中间的某处具有最长的文本。无论哪一行有最长的文本，我想在右边给出一个 5px 的填充，这样同一行下一列的文本不会立即开始。

我想对 HTML 表中的每一列都这样做。

是否可以在表级别执行此操作而不是在每一行中执行此操作？我怎样才能做到这一点？请帮忙！

样品表：

<!DOCTYPE html>
<html>
<body>
<table>
<tr><td>lengthy text</td><td>123</td><td>No</td></tr>
<tr><td>lengthiest text</td><td>123</td><td>No</td></tr>
<tr><td>lengthier text</td><td>123</td><td>No</td></tr>
</table>
</body>
</html>
4

2 回答 2

1

据我所知，实际上不可能只为最长的行添加填充；但是，您可以为所有<td>元素添加填充：

<html>
<head>
<style>
table tr td {
    padding-left: 5px;
    padding-right: 5px;
}
</style>
</head>
<body>
.... (your table code here)

或者，如果您知道第一行将始终包含最长的文本，则可以仅在此处添加填充：

<head>
<style>
table tr td:first-child {
    padding-left: 5px;
    padding-right: 5px;
}
</style>
</head>

有关详细信息，请参阅有关CSS 填充和CSS 选择器的文档。

于 2018-10-25T17:22:40.297 回答
0

这项工作：

<style>
   table tr td{
    padding: 0px 05px 0px 05px;
   }
  </style>
  <table>
   <tr><td>lengthy text</td><td>123</td><td>No</td></tr>
   <tr><td>lengthiest text</td><td>123</td><td>No</td></tr>
   <tr><td>lengthier text</td><td>123</td><td>No</td></tr>
  </table>

于 2018-10-25T18:20:15.957 回答