HTML - 表格单元格大小答案

【问题标题】：HTML - Table Cell SizesHTML - 表格单元格大小
【发布时间】：2017-06-30 14:26:15
【问题描述】：

enter code here对此很陌生，正在做我的第一个 HTML 项目。在其中我必须创建一个表，我已经设法做得很好。然而，它并不完全相同。这是我所拥有的：

<table>
    <tr>
        <td>1</td>
        <td>Thunder Road</td>
        <td>4:47</td>
    </tr>   
    <tr>
        <td>2</td>
        <td>10th Avenue Freeze Out</td>
        <td>3:10</td>
    </tr>
    <tr>
        <td>3</td>
        <td>Night</td>
        <td>3:00</td>
    </tr>
    <tr>
        <td>4</td>
        <td>Backstreet</td>
        <td>6:29</td>
    </tr>
    <tr>
        <td>5</td>
        <td>Born To Run</td>
        <td>4:29</td>
    </tr>
    <tr>
        <td>6</td>
        <td>She's The One</td>
        <td>4:29</td>
    </tr>
    <tr>
        <td>7</td>
        <td>Meeting Across The River</td>
        <td>3:15</td>
    </tr>
    <tr>
        <td>8</td>
        <td>Jungleland</td>
        <td>9:33</td>
    </tr>
</table>

它应该看起来像this

如何让曲目列表编号紧紧地放在那个单元格中？我已经尝试过 colspan 和 rowspan 并不能让它坐得那么舒服。

另外，我没有在上面的 HTML 中包含表格标题，但我确实有。有 2 个表格标题，但标题下方有 3 列。我怎样才能让所有东西像我链接的图片那样很好地坐在一起，而不是像我的那样？

谢谢！

【问题讨论】：

你是什么意思“数字紧紧地坐在那个牢房里”？请添加所有代码，以及标题的代码。
希望我告诉你the one I've currently got你会明白我的意思。

标签： html

【解决方案1】：

好的，我明白了。您需要下面的 HTML：

<table border="1">

    <tr>
        <td colspan="2">Bruce Springsteen<br>Born To Run</td>
        <td><img src="https://upload.wikimedia.org/wikipedia/en/7/7a/Born_to_Run_(Front_Cover).jpg"></td>
    </tr>
    <tr>
        <td>1</td>
        <td>Thunder Road</td>
        <td>4:47</td>
    </tr>   
    <tr>
        <td>2</td>
        <td>10th Avenue Freeze Out</td>
        <td>3:10</td>
    </tr>
    <tr>
        <td>3</td>
        <td>Night</td>
        <td>3:00</td>
    </tr>
    <tr>
        <td>4</td>
        <td>Backstreet</td>
        <td>6:29</td>
    </tr>
    <tr>
        <td>5</td>
        <td>Born To Run</td>
        <td>4:29</td>
    </tr>
    <tr>
        <td>6</td>
        <td>She's The One</td>
        <td>4:29</td>
    </tr>
    <tr>
        <td>7</td>
        <td>Meeting Across The River</td>
        <td>3:15</td>
    </tr>
    <tr>
        <td>8</td>
        <td>Jungleland</td>
        <td>9:33</td>
    </tr>
</table>

你也可以在这个JSFiddle上测试一下。

关键是在写有“Bruce Springsteen...”的<td> 上添加colspan="2"，这意味着该单元格将取代两列。

希望这对您有所帮助。如果它对您有帮助，您可以接受并支持我的回答。谢谢！

【讨论】：