正在处理需要在 Outlook 365 中工作的模板。不确定为什么橙色线条没有拉伸(stretch)以填充空间。这是用于 HTML 电子邮件,因此不能使用 Divs。
代码笔: http://codepen.io/leongaban/pen/HkDyx
<td style="100%" height="1">
<table width="100%" cellpadding="0" cellspacing="0" border="0">
<tr><td width="100%" height="1" bgcolor="#f67b1e"></td></tr>
</table>
<!-- <hr style="width: 100%; border-right: 0; border-left: 0; border: 1px solid #f67b1e;"> -->
</td>
最佳答案
在这里你只需声明这些线的宽度
<table width="600" cellpadding="0" cellspacing="0">
<tr>
<td colspan="3" height="20" bgcolor="gray"></td>
</tr>
<tr id="wants_an_intro" style="font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, 'Lucida Grande', sans-serif; color:#006497; text-align:center; font-size:24px; color: #f67b1e; width: 100%;">
<td style="width:30%" height="1"> <!-- width:30% -->
<table width="100%" cellpadding="0" cellspacing="0" border="0">
<tr><td width="100%" height="1" bgcolor="#f67b1e"></td></tr>
</table>
<!-- <hr style="width: 100%; border-right: 0; border-left: 0; border: 1px solid #f67b1e;"> -->
</td>
<td style="font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, 'Lucida Grande', sans-serif; font-size:1em; color:#f67b1e;">wants an intro to</td>
<td style="width:30%" height="1"> <!-- width:30% -->
<table width="100%" cellpadding="0" cellspacing="0" border="0">
<tr><td width="100%" height="1" bgcolor="#f67b1e"></td></tr>
</table>
<!-- <hr style="width: 100%; border-right: 0; border-left: 0; border: 1px solid #f67b1e;"> -->
</td>
</tr>
<tr>
<td colspan="3" height="20" bgcolor="gray"></td>
</tr>
</table>
或--------
<table width="600" cellpadding="0" cellspacing="0">
<tr>
<td colspan="3" height="20" bgcolor="gray"></td>
</tr>
<tr id="wants_an_intro" style="font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, 'Lucida Grande', sans-serif; color:#006497; text-align:center; font-size:24px; color: #f67b1e; width: 100%;">
<td width="30%" style="" height="1">
<table width="100%" cellpadding="0" cellspacing="0" border="0">
<tr><td width="100%" height="1" bgcolor="#f67b1e"></td></tr>
</table>
<!-- <hr style="width: 100%; border-right: 0; border-left: 0; border: 1px solid #f67b1e;"> -->
</td>
<td style="font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, 'Lucida Grande', sans-serif; font-size:1em; color:#f67b1e;">wants an intro to</td>
<td width="30%" style="" height="1">
<table width="100%" cellpadding="0" cellspacing="0" border="0">
<tr><td width="100%" height="1" bgcolor="#f67b1e"></td></tr>
</table>
<!-- <hr style="width: 100%; border-right: 0; border-left: 0; border: 1px solid #f67b1e;"> -->
</td>
</tr>
<tr>
<td colspan="3" height="20" bgcolor="gray"></td>
</tr>
</table>
关于html - 如何让 bgcolored td 拉伸(stretch)以适应,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19594653/