Question

我有一张Google表单，我试图强制以特定格式向我发送结果。它有效，但是我插入的表格上方有一个很大的空白区域，我想摆脱它。例如：

Hello!

I have a purchase request that I would like to submit for review, approval, 
and processing. Please see below and attached. Thanks.


















Name:   
Ryan M  

Project Number: 
Numbers 

Project Comments:   
No Comments 

Website Link to Product:    


Cost:   


Purpose of Order:   
Test    

Document Upload:    
https://drive.google.com/file/d//view   

Date Required By:   
2017-01-13  

Confirmed Lead Time:    
teeeeeest

以下是我使用的代码：

<!DOCTYPE html>
<html>
<head>
<style>
table {
    font-family: arial, sans-serif;
    border-collapse: collapse;
    width: 100%;
    margin-top:0px;
}

td, th {
    border: 1px solid #dddddd;
    text-align: left;
    padding: 8px;
}

tr:nth-child(even) {
    background-color: #dddddd;
}
</style>
</head>
<body>

<table>

<tr>
    <td><b>Name:</b></td>
    <td>{{Name}}</td>
</tr>
<tr>
    <td><b>Project Number:</b></td>
    <td>{{Project Number}}</td>
</tr>
<tr>
    <td><b>Project Comments:</b></td>
    <td>{{Project Comments}}</td>
</tr>
<tr>
    <td><b>Website Link to Product:</b></td>
    <td>{{Website Link to Product}}</td>
</tr>
<tr>
    <td><b>Cost:</b></td>
    <td>{{Cost}}</td>
</tr>
<tr>
    <td><b>Purpose of Order:</b></td>
    <td>{{Purpose of Order}}</td>
</tr>
<tr>
    <td><b>Document Upload:</b></td>
    <td>https://drive.google.com/file/d/{{Document Upload}}/view</td>
</tr>
<tr>
    <td><b>Date Required By:</b></td>
    <td>{{Date Required By}}</td>
</tr>
<tr>
    <td><b>Confirmed Lead Time:</b></td>
    <td>{{Confirmed Lead Time}}</td>
</tr>

</table>

</body>
</html>

任何线索都会有很大的帮助。谢谢！

Answer 1

HTML电子邮件可以在各种不同的工具中查看，其中没有一个（outlook）以相同的方式支持它（包括CSS标记）。

输出的方式让我觉得表格没有扩展到100％。注意表格单元格是如何堆叠的。这可能是您真正的问题，视口的症状。

您可以将<html>和<body>宽度设置为100％。尝试CSS和内联样式标记。

<body width="100%">

我会远离任何HTML5选项，例如<meta name="viewport" content="initial-scale=1, width=device-width">，因为您无法保证在电子邮件应用程序中提供支持。

CSS标记可能不是一个选项，因此您可以尝试将其全部内联。

希望这有帮助。

文本和HTML表之间的大空间

1 个答案: