0
我理解这可能是一件非常简单的事情，但我不知道任何人都可以帮助我解决我的问题，除了令人敬畏的Stack Overflow社区。一段时间以来，我还没有在这个范围内使用过HTML/CSS。页眉/页脚之间的HTML电子邮件模板内容问题
我正在尝试为我的业务创建一个更好看的新电子邮件模板。首先，我在WHMCS中遇到了一个全球CSS样式不起作用的问题。所以，要解决这个问题，我一直使用内联CSS页脚和头部分（见下文）：
我现在遇到的问题是页眉和页脚似乎要分开，并在中间，我想要电子邮件内容的地方，即使我在那里输入文字，也只有空白。我希望中间内容部分遵循上面和下面的样式，使其看起来无缝并且可以在其中键入文本。
下面是页眉和页脚两个密码（两者之间大的空间）：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset={$charset}" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<style type="text/css">
</style>
</head>
<body>
<table data-module="header" class="email_table currentTable" width="100%" border="0" cellspacing="0" cellpadding="0" style="box-sizing: border-box;border-spacing: 0;mso-table-lspace: 0;mso-table-rspace: 0;width: 100%;min-width: 100%!important;">
<tr>
<td class="email_body email_start" data-bgcolor="Body" style="box-sizing: border-box;vertical-align: top;line-height: 100%;text-align: center;padding-left: 16px;padding-right: 16px;padding-top: 32px;background-color: #dde5ee;font-size: 0!important;">
<!--[if (mso)|(IE)]><table width="800" border="0" cellspacing="0" cellpadding="0" align="center" style="vertical-align:top;width:800px;Margin:0 auto;"><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
<div class="email_container" style="box-sizing: border-box;font-size: 0;display: inline-block;width: 100%;vertical-align: top;margin: 0 auto;text-align: center;line-height: inherit;max-width: 800px!important;">
<table class="content_section" width="100%" border="0" cellspacing="0" cellpadding="0" style="box-sizing: border-box;border-spacing: 0;mso-table-lspace: 0;mso-table-rspace: 0;width: 100%;min-width: 100%!important;">
<tr>
<td class="content_cell header_c brt pt pb" data-bgcolor="Content" data-border-top-color="Accent" style="box-sizing: border-box;vertical-align: top;font-size: 0;display: inline-block;width: 100%;text-align: center;background-color: #ffffff;border-top: 4px solid #2376dc;border-radius: 4px 4px 0 0;padding-top: 16px;padding-bottom: 16px;line-height: inherit;">
<!-- col-6 -->
<div class="email_row" style="box-sizing: border-box;font-size: 0;display: block;width: 100%;vertical-align: top;margin: 0 auto;text-align: center;clear: both;line-height: inherit;max-width: 600px!important;">
<!--[if (mso)|(IE)]><table width="600" border="0" cellspacing="0" cellpadding="0" align="center" style="vertical-align:top;width:600px;Margin:0 auto;"><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
<div class="col_6" style="box-sizing: border-box;font-size: 0;display: inline-block;width: 100%;vertical-align: top;max-width: 600px;line-height: inherit;">
<table class="column" width="100%" border="0" cellspacing="0" cellpadding="0" style="box-sizing: border-box;border-spacing: 0;mso-table-lspace: 0;mso-table-rspace: 0;width: 100%;min-width: 100%!important;">
<tr>
<td class="column_cell px pt_xs pb_0 logo_c tc" data-color="Content" data-link-color="Accent" style="box-sizing: border-box;vertical-align: top;width: 100%;padding-top: 8px;padding-bottom: 0;font-family: Helvetica,Arial,sans-serif;font-size: 16px;line-height: 100%;color: #616161;mso-line-height-rule: exactly;text-align: center;padding-left: 16px;padding-right: 16px;min-width: 100%!important;">
<a href="#" data-color="Accent" style="text-decoration: none; line-height: inherit; color: rgb(35, 120, 220);"><img src="https://hypeservers.com/wp-content/uploads/2016/10/Logomakr_0tDvse-2.png" width="110" height="24" alt="Hype Servers" style="max-width: 168px;outline: none;border: 0;text-decoration: none;-ms-interpolation-mode: bicubic;clear: both;line-height: 100%;height: auto!important;" /></a>
</td>
</tr>
</table>
</div>
</div>
</td>
</tr>
<tr>
<td valign="top" class="bodyContent" style="box-sizing: border-box;vertical-align: top;font-size: 0;display: inline-block;width: 100%;text-align: center;background-color: #ffffff;line-height: inherit;">
<p>'Hello'</p>
</td>
<!--[if (mso)|(IE)]></td></tr></table><![endif]-->
<!-- </table> -->
<!-- </div> -->
<!--[if (mso)|(IE)]></td></tr></table><![endif]-->
<!-- </td> -->
<!-- </tr> -->
<!-- </table> -->
</table>
</div>
</td>
</tr>
</table>
<table data-module="footer_center" class="email_table" width="100%" border="0" cellspacing="0" cellpadding="0" style="box-sizing: border-box; border-spacing: 0; mso-table-lspace: 0; mso-table-rspace: 0; width: 100%; min-width: 100% !important;"><tr><td class="email_body email_end" data-bgcolor="Body" style="box-sizing: border-box; vertical-align: top; line-height: 100%; text-align: center; padding-left: 16px; padding-right: 16px; padding-bottom: 32px; font-size: 0 !important; background: #dde5ee;" align="center" bgcolor="#dde5ee" valign="top">
<!--[if (mso)|(IE)]>
<table width="800" border="0" cellspacing="0" cellpadding="0" align="center" style="vertical-align:top;width:800px;Margin:0 auto;">
<tbody>
<tr>
<td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
<![endif]-->
<div class="email_container" style="box-sizing: border-box; font-size: 0; display: inline-block; width: 100%; vertical-align: top; text-align: center; line-height: inherit; max-width: 800px !important; margin: 0 auto;" align="center">
<table class="content_section" width="100%" border="0" cellspacing="0" cellpadding="0" style="box-sizing: border-box; border-spacing: 0; mso-table-lspace: 0; mso-table-rspace: 0; width: 100%; min-width: 100% !important;"><tr><td class="content_cell footer_c py bt brb" data-bgcolor="Accent" data-border-top-color="Default" style="box-sizing: border-box; vertical-align: top; font-size: 0; display: inline-block; width: 100%; text-align: center; border-radius: 0 0 4px 4px; padding-top: 16px; padding-bottom: 16px; border-top-width: 1px; border-top-style: solid; border-top-color: #d7dbe0; line-height: inherit; background: #ffffff;" align="center" bgcolor="#ffffff" valign="top">
<!-- col-6 -->
<div class="email_row" style="box-sizing: border-box; font-size: 0; display: block; width: 100%; vertical-align: top; text-align: center; clear: both; line-height: inherit; max-width: 600px !important; margin: 0 auto;" align="center">
<!--[if (mso)|(IE)]>
<table width="600" border="0" cellspacing="0" cellpadding="0" align="center" style="vertical-align:top;width:600px;Margin:0 auto;">
<tbody>
<tr>
<td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
<![endif]-->
<div class="col_6" style="box-sizing: border-box; font-size: 0; display: inline-block; width: 100%; vertical-align: top; max-width: 600px; line-height: inherit;">
<table class="column" width="100%" border="0" cellspacing="0" cellpadding="0" style="box-sizing: border-box; border-spacing: 0; mso-table-lspace: 0; mso-table-rspace: 0; width: 100%; min-width: 100% !important;"><tr><td class="column_cell tc pb_0" data-color="Footer" data-link-color="Footer Link" style="box-sizing: border-box; vertical-align: top; width: 100%; padding-top: 16px; padding-bottom: 0; font-family: 'Open Sans',sans-serif !important; font-size: 16px; line-height: 23px; color: #999999; mso-line-height-rule: exactly; text-align: center; min-width: 100% !important;" align="center" valign="top">
<p class="fsocial" data-color="Footer" style="font-family: 'Open Sans',sans-serif !important; font-size: 16px; line-height: 100%; color: #999999; mso-line-height-rule: exactly; display: block; margin-top: 0; margin-bottom: 16px;">
<a href="#" style="text-decoration: underline; line-height: inherit; color: #999999; display: inline-block;">
</a>
<a href="#" style="text-decoration: underline; line-height: inherit; color: #999999; display: inline-block;">
<img src="http://www.stampready.net/dashboard/editor/user_uploads/zip_uploads/2017/07/16/HZUKBlFvVrCsqQm6I51iRE7A/stampready_template/images/twitter_64_dark.png" width="24" height="24" alt="" style="max-width: 24px; outline: none; text-decoration: none; -ms-interpolation-mode: bicubic; clear: both; line-height: 100%; height: auto !important; border: 0;" /></a>
<a href="#" style="text-decoration: underline; line-height: inherit; color: #999999; display: inline-block;">
</a>
</p>
<p data-color="Footer" style="font-family: 'Open Sans',sans-serif !important; font-size: 16px; line-height: 23px; color: #999999; mso-line-height-rule: exactly; display: block; margin-top: 0; margin-bottom: 16px;">
©2017 Hype Servers<br />
3000 Fake Address Way, Fake Town 736278. \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </p>
<p data-color="Footer" style="font-family: 'Open Sans',sans-serif !important; font-size: 16px; line-height: 23px; color: #999999; mso-line-height-rule: exactly; display: block; margin-top: 0; margin-bottom: 16px;">
You are subscribed to Hype Servers Mailing List. <a href="#" data-color="Footer Link" style="text-decoration: underline; line-height: inherit; color: #999999; display: inline-block;">
<span data-color="Footer Link" style="text-decoration: underline; line-height: inherit; color: #999999;">
Unsubscribe</span>
</a>
</p>
</td>
</tr></table></div>
<!--[if (mso)|(IE)]>
</td>
</tr>
</tbody>
</table>
<![endif]-->
</div>
</td>
</tr></table></div>
<!--[if (mso)|(IE)]>
</td>
</tr>
</tbody>
</table>
<![endif]-->
</td>
</tr></table></body>
</html>