为什么在邮件中发送时文本没有居中？

Question

我有一个普通的html代码。

<span style="bottom: 65px;
    position: relative;
    left: 100px; color: red;">Hiii</span>
    <img   src="https://vignette.wikia.nocookie.net/sqmegapolis/images/2/2d/RealWorld_Stonehenge.jpg/revision/latest?cb=20150616102050">

运行此代码时，文本居中。

但是当我将此代码发送给gmail时，外观就会改变。 在gmail中看起来像

此处文本未居中，当我检查文本时，我还发现所有CSS均未传递给gmail。

此CSS未通过：

bottom: 65px;
position: relative;
left: 100px;

每当我将此html正文发送到gmail / mail时，我都需要文本始终居中。

Answer 1

我建议使用表格发送电子邮件。但是div可以帮助您。

<div style="width:600px;">
<div style="text-align: center; color: #ff0000;">
  Hello World. I'm in the center :)
</div>
<img src="https://vignette.wikia.nocookie.net/sqmegapolis/images/2/2d/RealWorld_Stonehenge.jpg/revision/latest?cb=20150616102050" style="width: 100%;">
</div>

带表（全部居中）：

<table align="center" border="0" cellpadding="0" cellspacing="0" width="600">
    <tr>
        <td align="center">
            Hello World. I&#39;m in the center :)
        </td>
    </tr>
    <tr>
        <td align="center">
            <img src="https://vignette.wikia.nocookie.net/sqmegapolis/images/2/2d/RealWorld_Stonehenge.jpg/revision/latest?cb=20150616102050" style="width: 100%">
        </td>
    </tr>
</table>