html - html 在每个表格行旁边放置一个链接

Question

我有一个表，每行包含三列，我希望每行在它旁边添加一个链接。

<table>
    <th>
        Name:
    </th>
    <th>
        Price:
    </th>
    <th>
        Description
    </th>

    <?php while ($row = $foods->fetch()) { ?>
        <tr>
            <td>
                <?php echo $row['Name']; ?>
            </td>
            <td>
                <?php echo $row['foodPrice']; ?>
            </td>
            <td>
                <?php echo $row['foodDescription']; ?>
            </td>
        <a class="editLink">roma</a>
        </tr>
    <?php } ?>
</table>

我试图a在最后一个链接之后添加一个链接，td但链接变成了表格的顶部，在此先感谢

Answer 1

您需要添加一个表格单元格以包含该链接。标签也th应该用tr标签包围。

<table>
    <tr>
        <th>
            Name:
        </th>
        <th>
            Price:
        </th>
        <th>
            Description
        </th>
        <th>
        </th>
    </tr>

    <?php while ($row = $foods->fetch()) { ?>
        <tr>
            <td>
                <?php echo $row['Name']; ?>
            </td>
            <td>
                <?php echo $row['foodPrice']; ?>
            </td>
            <td>
                <?php echo $row['foodDescription']; ?>
            </td>
            <td class="link"><!-- Your missing this -->
                <a class="editLink">roma</a>
            </td><!-- and this -->
        </tr>
    <?php } ?>
</table>

要设置与其他链接单元格不同的样式，您需要使用 CSS。将 CSS 类添加link到td包含您的a标签。然后定义样式如下：

CSS

table{
    text-align: center;
}

td{
    width: 200px;
}

td.link{
    width: 50px;
}

工作示例：http: //jsfiddle.net/y9C3G/

Answer 2

<a>直接在类似的内部放置标签是无效的<tr>。通过将链接放在其自己的单元格中，将另一列添加到表中。您可能还想<th>在第一行添加另一个，或者colspan="2"向描述添加一个属性。

此外，需要一个表格来包含一个<tbody>元素，我建议将您<th>的 s 放在 a 中<thead>：

<table>
  <thead>
    ...
  </thead>
  <tbody>
    ...
  </tbody>
</table>

Answer 3

<tr>
    <td>Your Content</td>
    <td>Your Content</td>
    <td>Your Content</td>
    <td class="myLinkClass"><a href=""></a></td>
</tr>

<style>
    .myLinkClass {
        width: 100px; /* This will give width for only the td with this class */ 
    }
</style>