如何在HTML表格带rowspan属性的跨行单元格中插入文本

解决方案 #

你的问题出在表格结构缺列：第一行定义了4列（名字列、跨3行的Bild1列、水果列、跨3行的Bild2列），但第2、3行只写了名字列的单元格，没有补充水果列的单元格，所以插入内容时会错位换行。
你只需要在<tr>标签对里对应位置补上<td>标签放你要的内容即可，修改后的完整代码如下：

<!DOCTYPE html>
<html>
    <head>
        <title>HTML rowspan Attribute</title>
        <style>
            table, th, td {
                border: 1px solid black;
                border-collapse: collapse;
                padding: 6px;
            }
        </style>
    </head>

    <body style = "text-align:center">

        <table>
            <tr>
                <td>Ajay</td>
                <td rowspan="3">Bild1</td> 
                <td>Bananas</td>
                <td rowspan="3">Bild2</td>
            </tr>
            
            <tr>
                <td>Priya1</td>
                <!-- 这里填入第一个要插入的内容 -->
                <td>你要添加的第一个文本</td>
            </tr>
            <tr>
                <td>Priya</td>
                <!-- 这里填入第二个要插入的内容 -->
                <td>你要添加的第二个文本</td>
            </tr>
        </table>
        
    </body>
</html>

修改后内容会对应显示在你标注的两个单元格位置，不会出现自动换行错位的问题。

内容的提问来源于stack exchange，提问作者Kollegah der Boss