Question

Here is the image

我希望图像以表格标记和文本为中心，如果它溢出，就会在新行中。

在表格标签中，如何将图像放在桌子中央，并将文字放在并排图像下方。

我想要一张图片，在它下面，应该有一些文字。但是当文本溢出时，剩下的文本应该在新行中。

我只能使用内联css ，并且无法使用其他标签，例如 div 。我也不能使用位置属性。正在我制作HTML电子邮件。必须坚持使用表格标签。

＆＃13;

<table style="margin: 0 auto; border: thin green solid;" width="600">
    <tr>
        <td style="margin:0; padding: 0;" align="center">
            <img src="http://www.hubilo.com/eventApp/ws//images/speaker/profile/thumb/2712_1455949782.jpeg" width="110" height="110" style="display: block; margin: 0 auto;">
            <p>Some Text</p>
        </td>

        <td style="margin:0; padding: 0;" align="center">
            <img src="http://www.hubilo.com/eventApp/ws//images/speaker/profile/thumb/2712_1455949782.jpeg" width="110" height="110" style="display: block; margin: 0 auto;">
            <p>Some Text</p>
        </td>

        <td style="margin:0; padding: 0;" align="center">
            <img src="http://www.hubilo.com/eventApp/ws//images/speaker/profile/thumb/2712_1455949782.jpeg" width="110" height="110" style="display: block; margin: 0 auto;">
            <p>Some Text Some TextSome TextSome TextSome TextSome Text</p>
        </td>

        <td style="margin:0; padding: 0;" align="center">
            <img src="http://www.hubilo.com/eventApp/ws//images/speaker/profile/thumb/2712_1455949782.jpeg" width="110" height="110" style="display: block; margin: 0 auto;">
            <p>Some Text</p>
        </td>
    </tr>
</table>

＆＃13;

如代码段中所示，我希望在下一行显示额外的文本，并将图像显示在表格的中心。

Answer 1

试试这个：

<table style="margin: 0 auto; border: thin green solid;" width="600">
<tr>
    <td style="margin:0; padding: 0;" align="center">
        <img src="http://www.hubilo.com/eventApp/ws//images/speaker/profile/thumb/2712_1455949782.jpeg" width="110" height="110" style="display: block; margin: 0 auto;">
    </td>
    <td style="margin:0; padding: 0;" align="center">
        <img src="http://www.hubilo.com/eventApp/ws//images/speaker/profile/thumb/2712_1455949782.jpeg" width="110" height="110" style="display: block; margin: 0 auto;">
    </td>
    <td style="margin:0; padding: 0;" align="center">
        <img src="http://www.hubilo.com/eventApp/ws//images/speaker/profile/thumb/2712_1455949782.jpeg" width="110" height="110" style="display: block; margin: 0 auto;">
    </td>
    <td style="margin:0; padding: 0;" align="center">
        <img src="http://www.hubilo.com/eventApp/ws//images/speaker/profile/thumb/2712_1455949782.jpeg" width="110" height="110" style="display: block; margin: 0 auto;"> 
    </td>
</tr>
<tr>
    <td style="margin:0; padding: 0; width: 110px;" align="center">
        <p>Some Text</p>
    </td>
    <td style="margin:0; padding: 0; width: 110px;" align="center">
        <p>Some Text</p>
    </td>
    <td style="margin:0; padding: 0; width: 110px;" align="center">
        <p>Some Text Some TextSome TextSome TextSome TextSome TextSome Text</p>
    </td>
    <td style="margin:0; padding: 0; width: 110px;" align="center">
        <p>Some Text</p>
    </td>
</tr>

重要的是你在上面的行中为表格单元格指定图像的宽度。

将图像放在桌子的中央，如果有额外的文字，图像下方的文字应该是新的

1 个答案: