Html 为什么嵌套表会改变手机上页面的比例？
我正在尝试创建一封带有嵌套表的HTML电子邮件（我知道，我知道）。包括在内Html 为什么嵌套表会改变手机上页面的比例？,html,css,html-email,Html,Css,Html Email,我正在尝试创建一封带有嵌套表的HTML电子邮件（我知道，我知道）。包括在内 在手机上设置适当的页面宽度和初始缩放比例。在添加嵌套表之前，所有内容看起来都是正确的，但一旦该表嵌套，在移动设备上查看时会发生两件我不理解的事情：1）整个页面放大到桌面大小，2）嵌套表的内容小于页面其余部分的内容。有人能解释为什么会发生这种情况，以及我能做些什么来避免它吗 添加嵌套表之前（看起来正确）： 试验 Lorem ipsum Door sit amet，Concertetur Adipising elit。维
试验
Lorem ipsum Door sit amet，Concertetur Adipising elit。维塔伊·奎斯是里苏斯的维塔伊。在面部舌苔中，有一个共同的元素。在迪亚姆乌尔纳，酒后驾车。埃尼亚流苏车。狮子座的狮子座，乌龟座的狮子座。一个大酒杯，一个大酒杯。这是一位杰出的艺术家。Donec ultricies lorem nec justo hendrerit lobortis。马蒂斯·马萨（mattis massa）是一位名叫阿梅特·福西布斯·伊普苏姆·索达莱斯（amet faucibus ipsum sodales）的女士，她是一位名叫内科医生（nec orci justo）的女士，也是一位放纵猫咪的女士。塞德·康格、尼斯拉·诺丁·阿迪皮斯、尼布·努克·拉齐尼亚·利奥、世仇式的世仇式的世仇式的世仇
查看此电子邮件时出现问题
试验
Foo
条形图
Lorem ipsum Door sit amet，Concertetur Adipising elit。维塔伊·奎斯是里苏斯的维塔伊。在面部舌苔中，有一个共同的元素。在迪亚姆乌尔纳，酒后驾车。埃尼亚流苏车。狮子座的狮子座，乌龟座的狮子座。一个大酒杯，一个大酒杯。这是一位杰出的艺术家。Donec ultricies lorem nec justo hendrerit lobortis。马蒂斯·马萨（mattis massa）是一位名叫阿梅特·福西布斯·伊普苏姆·索达莱斯（amet faucibus ipsum sodales）的女士，她是一位名叫内科医生（nec orci justo）的女士，也是一位放纵猫咪的女士。塞德·康格、尼斯拉·诺丁·阿迪皮斯、尼布·努克·拉齐尼亚·利奥、世仇式的世仇式的世仇式的世仇
查看此电子邮件时出现问题
td width=“680”<!doctype html>
<html>
<head>
<title>Test</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body style="background: #F0F2F2 url(https://thomasprintworks.com/temp/dynamic-letter1/light-gray-geometric-pattern.png);">
<center>
<table style="background: #FFFFFF; max-width: 800px; border: 1px solid #DDD" cellpadding="0" cellspacing="0">
<tr>
<td width="60" valign="top"><img src="https://thomasprintworks.com/temp/dynamic-letter1/clear.gif" width="60"></td> <!-- spacer column -->
<td width="680">
<p style="font-family:Helvetica, Arial, sans-serif; color: #414141; font-size: 16px; line-height: 1.5; margin-top: 0;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque vitae est ut nunc iaculis luctus vitae in risus. Proin mollis facilisis ligula, sed elementum odio consequat quis. Sed at diam urna, vulputate egestas dui. Aenean vehicula fringilla dapibus. Fusce aliquet rhoncus leo, vel tempus mi auctor ultricies. Aliquam pulvinar luctus odio, rhoncus tincidunt diam egestas nec. Quisque semper mauris luctus augue rutrum ultrices ut tincidunt elit. Donec ultricies lorem nec justo hendrerit lobortis. Curabitur rutrum mattis massa, sit amet faucibus ipsum sodales id. Sed nec orci justo, et vulputate felis. Sed congue, nisl non tincidunt adipiscing, nibh nunc lacinia leo, feugiat feugiat erat neque sit amet est.</p>
</td>
<td width="60" valign="top"><img src="https://thomasprintworks.com/temp/dynamic-letter1/clear.gif" width="60"></td> <!-- spacer column -->
</tr>
<tr> <!-- spacer row -->
<td><img src="https://thomasprintworks.com/temp/dynamic-letter1/clear.gif" width="30"></td>
</tr>
<tr>
<td bgcolor="#DDD" colspan="3">
<p style="font-family:Helvetica, Arial, sans-serif; color: #414141; font-size: 10px; line-height: 1.5; text-align: center;">Problems viewing this email? <a style="color:#13AAD9" href="#">View in browser</a></p>
</td>
</tr>
</table> <!-- end container table -->
<br><br>
</center>
</body>
</html>
<!doctype html>
<html>
<head>
<title>Test</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body style="background: #F0F2F2 url(https://thomasprintworks.com/temp/dynamic-letter1/light-gray-geometric-pattern.png);">
<center>
<table style="background: #FFFFFF; max-width: 800px; border: 1px solid #DDD" cellpadding="0" cellspacing="0"> <tr>
<td width="60" valign="top"><img src="https://thomasprintworks.com/temp/dynamic-letter1/clear.gif" width="60"></td> <!-- spacer column -->
<td>
<table style="width: 680px;" cellpadding="0" cellspacing="0"> <!-- START nested table -->
<tr>
<td width="250">
<p style="font-family:Helvetica, Arial, sans-serif; color: #414141; font-size: 16px; line-height: 1.5; margin-top: 0;">Foo</p>
</td>
<td width="250">
<p style="font-family:Helvetica, Arial, sans-serif; color: #414141; font-size: 16px; line-height: 1.5; margin-top: 0;">Bar</p>
</td>
</tr>
</table> <!-- END nested table -->
</td>
<td width="60" valign="top"><img src="https://thomasprintworks.com/temp/dynamic-letter1/clear.gif" width="60"></td> <!-- spacer column -->
</tr>
<tr>
<td width="60" valign="top"><img src="https://thomasprintworks.com/temp/dynamic-letter1/clear.gif" width="60"></td> <!-- spacer column -->
<td width="680">
<p style="font-family:Helvetica, Arial, sans-serif; color: #414141; font-size: 16px; line-height: 1.5; margin-top: 0;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque vitae est ut nunc iaculis luctus vitae in risus. Proin mollis facilisis ligula, sed elementum odio consequat quis. Sed at diam urna, vulputate egestas dui. Aenean vehicula fringilla dapibus. Fusce aliquet rhoncus leo, vel tempus mi auctor ultricies. Aliquam pulvinar luctus odio, rhoncus tincidunt diam egestas nec. Quisque semper mauris luctus augue rutrum ultrices ut tincidunt elit. Donec ultricies lorem nec justo hendrerit lobortis. Curabitur rutrum mattis massa, sit amet faucibus ipsum sodales id. Sed nec orci justo, et vulputate felis. Sed congue, nisl non tincidunt adipiscing, nibh nunc lacinia leo, feugiat feugiat erat neque sit amet est.</p>
</td>
<td width="60" valign="top"><img src="https://thomasprintworks.com/temp/dynamic-letter1/clear.gif" width="60"></td> <!-- spacer column -->
</tr>
<tr> <!-- spacer row -->
<td><img src="https://thomasprintworks.com/temp/dynamic-letter1/clear.gif" width="30"></td>
</tr>
<tr>
<td bgcolor="#DDD" colspan="3">
<p style="font-family:Helvetica, Arial, sans-serif; color: #414141; font-size: 10px; line-height: 1.5; text-align: center;">Problems viewing this email? <a style="color:#13AAD9" href="#">View in browser</a></p>
</td>
</tr>
</table> <!-- end container table -->
<br><br>
</center>
</body>
</html>