table += `<table border="0" width="760" align="center" cellpadding="0" cellspacing="0" >
<tbody><tr bgcolor="#00205c">
<td height="40" style="color: #fff; font-size: 15px; font-weight: 700; font-family: 'Roboto', Arial, sans-serif; padding-left: 10px;">
${dataset.name}</td>
</tr>
<tr>
<td bgcolor="#fff" height="5"></td>
</tr>
</tbody>
</table>`;
table +=
'<table bgcolor="ffffff" border="0" width="760" align="center" cellpadding="0" cellspacing="0" style="margin: 0 auto; border: 1px solid black;">';
table += '<thead>';
table += '<tr bgcolor="#00205c">';
dataset.columns.forEach((field) => {
table += `<th align="left" style="color: #fff; font-size: 14px; font-family: 'Roboto', Arial, sans-serif; padding-left: 10px">${titleCase(
replaceUnderscores(
`${field.label ?? (typeof field === 'string' ? field : field.name)}`
)
)}</th>`;
});
table += '</tr></thead>';
table += '<tbody>';
// Iterate over each record
for (const record of dataset.records) {
table += '<tr>';
// Create a new cell for each field in the record
for (const column of dataset.columns) {
table += `<td style = "color: #000; font-size: 15px; font-family: 'Roboto', Arial, sans-serif; padding-left: 20px; padding-top: 8px;padding-bottom: 8px; border-bottom:1px solid #d1d5db;">
${formatDates(record[column.name])}</td>`;
}
table += '</tr>';
}
table += '</tbody>';
table += '</table>';
我正在制作这样的表格,它在其他客户端(即 Outlook Web 版本、gmail 等)上运行良好,但在 Outlook Classicsic Windows 应用程序中无法运行
预期结果
我尝试过条件方法,但没有奏效
我已附上 stackblitz 链接供参考 https://stackblitz.com/edit/stackblitz-starters-cmqgwj?file=index.html
Outlook 客户端的更新截图:它从右侧被截断
Outlook 经典客户端电子邮件模板表格列被挤压
下载声明:
本站所有软件和资料均为软件作者提供或网友推荐发布而来,仅供学习和研究使用,不得用于任何商业用途。如本站不慎侵犯你的版权请联系我,我将及时处理,并撤下相关内容!
-
您能否尝试从表格本身移除宽度,然后设置列宽?如果您能添加生成的 html 以便我们自己测试,那就太好了。
返回