html - html标签中的CSS，文本不在框中

Question

我在我的 PHP 应用程序中发送电子邮件。我知道不建议这样做，但为了简单起见，我只想将 CSS 样式放在标签中。我试过这个：

<div style=\"width: 500px; height: 600px; background-color: green;\">
<h1>Title</h1>

<div style=\"width: 460px; height: 540px; background-color: white; margin-top: 10px; margin-left: auto; margin-right: auto;\">
$content
</div>
</div>

样式工作正常，但 $content 字符串很长，文本只是从框中流出，而不是整齐地转到下一行。当您在标签中使用 style 属性时，这是否特别？还是与电子邮件客户端读取电子邮件的方式有关？

有没有办法在不使用外部 CSS 文件的情况下解决这个问题？

编辑：这是我在屏幕截图中的问题：

这是与word-break: normal. 我想避免破坏单词，但将 $content 保持在 div 的边界内。

这是格式化电子邮件的问题吗？常规 html 页面中完全相同的代码显示在 div 的边界内。

Answer 1

为了将内容保存在我的容器中，这通常是为我做的：

.break-word {
    word-wrap: break-word;
}

不过，我会尽可能建议使用外部 CSS 文件。

Answer 2

试试这个：

    <div style="width: 500px; height: 600px; background-color: green;">
    <h1>Title</h1>

    <div style="width: 460px; height: 540px; background-color: white; margin-top: 10px;     margin-left: auto; margin-right: auto; word-wrap:break-word;">
$content
    </div>
    </div>

Answer 3

.break-word {
   padding:1em 1em;
}