HTML内联CSS表行高度? (图像不同步)

时间:2017-08-30 09:05:55

标签: html css html-table

我正在处理HTML表格,但遇到行高问题。

我只能访问内联CSS,这是我到目前为止所拥有的:

<table style="width: 100%;">
    <tbody>
        <tr>
            <th></th>
            <th></th>
            <th>Nominal TEU tdw</th>
            <th>LOA m</th>
            <th>Breath m</th>
            <th>Depth m</th>
            <th>Draft m</th>
        </tr>
        <tr>
            <td>
                  <strong>OOCL HONG KONG</strong>
                  <strong>6 units in series</strong>
                  <strong>from May 2017</strong>
            </td>
            <td style="text-align: center;"><img class="" src="<website>/OOCL-HONG-KONG.png" alt="OOCL HONG KONG" /></td>
            <td>
                <p style="text-align: center;"><strong>21,413 teu</strong></p>
                <p style="text-align: center;">191,317 tdw</p>
            </td>
            <td style="text-align: center;"><strong>399.9</strong></td>
            <td style="text-align: center;"><strong>58.8</strong></td>
            <td style="text-align: center;"><strong>32.5</strong></td>
            <td style="text-align: center;"><strong>16.0</strong></td>
        </tr>

Here is an image of the issue. The top is how it currently is, the bottom is what I'm struggling to achieve

以前是否有人遇到此问题并知道解决方案?

非常感谢

1 个答案:

答案 0 :(得分:0)

你能试试这个:valign="bottom"和@Huelfe说的一样,vertical-align:bottom他在我试图创建片段时回答了

&#13;
&#13;
<table style="width: 100%;">
<tbody>
<tr>
<th></th>
<th></th>
<th>Nominal TEU
tdw</th>
<th>LOA
m</th>
<th>Breath
m</th>
<th>Depth
m</th>
<th>Draft
m</th>
</tr>
<tr>
<td valign="bottom"><strong>OOCL HONG KONG</strong></td><td style="text-align: center;"><img class="" src="<website>/OOCL-HONG-KONG.png" alt="OOCL HONG KONG" /></td><td style="text-align: center;"  valign="bottom"><strong>21,413 teu
</strong>
</tr>
<tr>
<td>
<strong>6 units in series</strong><strong>from May 2017</strong></td>
<td></td>
<td>
<p style="text-align: center;">191,317 tdw</p>
</td>
<td style="text-align: center;"><strong>399.9</strong></td>
<td style="text-align: center;"><strong>58.8</strong></td>
<td style="text-align: center;"><strong>32.5</strong></td>
<td style="text-align: center;"><strong>16.0</strong></td>
</tr>
</table>
&#13;
&#13;
&#13;