根据文档 https://developers.weixin.qq.com/doc/offiaccount/Draft_Box/Add_draft.html
content 是图文消息的具体内容，支持HTML标签，必须少于2万字符，小于1M，且此处会去除JS,涉及图片url必须来源 "上传图文消息内的图片获取URL"接口获取。外部图片url将被过滤。
我在调用新建草稿的API时，设置参数content为一段网页的html源码(不包含js)，并将双引号改成单引号(双引号通不过，会报invalid media id的错误)，成功新建了草稿。但当我从微信公众号后台打开这个草稿时，发现样式完全不对。
看文档content是支持html标签的，可为何传入的html显示出来的效果和原网页完全不一样？不是说支持html吗？为何上传后的html和上传前差别这么大？
上传前html长这样
上传到草稿后长这样
附html源码
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My Email Subject</title>
<meta name="referrer" content="never">
<meta name="format-detection" content="telephone=no,date=no,address=no,email=no">
<meta name="x-apple-disable-message-reformatting">
<meta type="xrm/designer/setting" name="type" value="marketing-designer-content-editor-document">
<meta type="xrm/designer/setting" name="layout-editable" value="marketing-designer-layout-editable">
<meta type="xrm/designer/setting" name="layout-max-width" value="600px" datatype="text" label="Layout max width">
<style>
:root {
--brand-color1: #5900fe;
--brand-color2: #330099;
--brand-color3: #e1dfdd;
--brand-color4: #666666;
--brand-color5: #cccccc;
--brand-color6: #333333;
--brand-color7: #0082dd;
--brand-color8: #0742ab;
--brand-color9: #494949;
}
body {
font-family: Arial, Verdana, sans-serif;
font-size: 14px;
color: rgb(0, 0, 0);
background-color: rgb(255, 255, 255);
}
h1 {
color: rgb(0, 0, 0);
font-size: 34px;
font-weight: normal;
font-family: Verdana, Arial, sans-serif;
line-height: inherit;
text-align: left;
}
h2 {
color: rgb(51, 51, 51);
font-size: 24px;
font-weight: normal;
font-family: sans-serif;
line-height: inherit;
text-align: left;
}
h3 {
color: rgb(0, 0, 0);
font-size: 16px;
font-weight: normal;
font-family: Verdana, Arial, sans-serif;
line-height: inherit;
text-align: left;
}
p {
font-family: Arial, Verdana, sans-serif;
font-size: 14px;
color: rgb(0, 0, 0);
line-height: inherit;
font-weight: normal;
text-align: left;
}
a {
font-family: Arial, Verdana, sans-serif;
font-size: 14px;
font-weight: normal;
color: rgb(0, 130, 221);
text-decoration: none;
}
.buttonWrapper {
margin: 10px 0px;
}
.buttonClass {
font-family: Arial, Verdana, sans-serif;
font-size: 16px;
font-weight: normal;
border-radius: 4px;
color: white;
border: none;
background-color: rgb(7, 66, 171);
padding: 10px 20px;
text-decoration: none;
}
.buttonClass span {
font-family: inherit;
text-decoration: inherit;
}
.divider {
border-top: 2px solid silver;
margin: 10px 0px;
width: 100%;
}
div div {
background-color: transparent;
}
[data-layout="true"] {
border: none;
margin: 0px auto;
background-color: rgb(255, 255, 255);
max-width:
/* @layout-max-width */
600px
/* @layout-max-width */
;
}
</style>
</head>
<body><div data-section="true" class="emptyContainer columns-equal-class wrap-section">
<table class="outer" align="center" cellpadding="0" cellspacing="0" style="width: 600px; display: block;">
<tbody>
<tr>
<th style="padding-right: 10px; padding-bottom: 10px; padding-left: 10px;">
<table style="
width: 100%;
border-collapse: collapse;
" class="containerWrapper tbContainer" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<th class="columnContainer" style="vertical-align:top; min-width: 5px; width: 580px; ; height: 0px;"
id="containerdc430676a1331697082378581">
<table width="100%" cellpadding="0" cellspacing="0" style="height: 100%;">
<tbody>
<tr>
<th class="inner"
style="text-align:left;min-width:5px;padding:10px;vertical-align:top;word-wrap:break-word;word-break:break-word;font-weight:400">
<div data-editorblocktype="Divider"
style="margin-right: 10px; margin-bottom: 20px; margin-left: 10px;">
<div class="dividerWrapper" align="center">
<table
style="padding: 0px; margin: 0px; width: 100%; border-collapse: collapse;"
cellpadding="0" cellspacing="0">
<tbody>
<tr style="padding: 0px;">
<th
style="margin:0px; padding: 0px; vertical-align:top;border-top-width: 2px; border-top-style: solid; border-top-color: #e1dfdd;">
<p
style="margin: 0px; padding: 0px; line-height: 0px; width: 100%;">
<span><!--[if gte mso 9]><br/><![endif]--> </span>
</p>
</th>
</tr>
</tbody>
</table>
</div>
</div>
</th>
</tr>
</tbody>
</table>
</th>
</tr>
</tbody>
</table>
</th>
</tr>
</tbody>
</table>
</div>
<div data-section="true" class="emptyContainer columns-equal-class wrap-section">
<table class="outer" align="center" cellpadding="0" cellspacing="0" style="width: 600px; display: block;">
<tbody>
<tr>
<th style="padding-right: 10px; padding-bottom: 10px; padding-left: 10px;">
<table style="
width: 100%;
border-collapse: collapse;
" class="containerWrapper tbContainer multi" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<th data-container="true" class="columnContainer" data-container-width="50.00"
style="vertical-align: top; min-width: 5px; width: 290px; height: 0px;"
id="container6f54de0bb96741697082433235">
<table width="100%" cellpadding="0" cellspacing="0" style="height: 100%;">
<tbody>
<tr>
<th class="inner"
style="min-width: 5px; padding-right: 10px; padding-bottom: 10px; padding-left: 10px; vertical-align: top; word-wrap: break-word; word-break: break-word; font-weight: normal;">
<div data-editorblocktype="Image" style="margin: 10px;">
<div align="center" class="imageWrapper" style="width: 100%;"
width="100%">
<div class="clear"
style="clear: both; height: 0px; width: 0px;">
</div>
</div>
</div>
<div data-editorblocktype="Text" style="margin: 10px;">
<p style="margin-bottom:18px">
<span style="font-size:16px;"><span style="font-family:Calibri,sans-serif"><b><span lang="EN-US"><span style="font-family:"Georgia",serif"><span style="color:#5900fe">Critical Thinking Program<br><i>(for ages 9-14)</i></span></span></span></b></span></span>
</p>
</div>
<div data-editorblocktype="Text" style="margin: 10px;">
<p><b><span lang="EN-US" style="font-size:10.5pt"><span style="font-family:"Arial",sans-serif"><span style="color:black">Master critical and lateral thinking skills and explore current affairs in preparation for local to international school transition, IB research, in-depth investigation in A Levels and DSE Liberal Studies.</span></span></span></b>
</p>
</div>
</th>
</tr>
</tbody>
</table>
</th>
<th data-container="true" class="columnContainer" data-container-width="50.00"
style="vertical-align: top; min-width: 5px; width: 290px; height: 0px;"
id="container5b163b96e1aad1697082767606">
<table width="100%" cellpadding="0" cellspacing="0" style="height: 100%;">
<tbody>
<tr>
<th class="columnContainer inner"
style="padding-right: 10px; padding-bottom: 10px; padding-left: 10px; min-width: 5px; vertical-align: top; word-wrap: break-word; word-break: break-word; font-weight: normal;">
<div data-editorblocktype="Image" style="margin: 10px;">
<div align="center" class="imageWrapper"
data-image-file-id="3884883c-b268-ee11-9ae7-002248ecf784"
width="100%" style="width: 100%;">
<div class="clear"
style="clear: both; height: 0px; width: 0px;">
</div>
</div>
</div>
<div data-editorblocktype="Text" style="margin: 10px;">
<p style="margin-bottom:18px">
<span style="font-size:16px;"><span style="font-family:Calibri,sans-serif"><b><span lang="EN-US"><span style="font-family:"Georgia",serif"><span style="color:#5900fe">Reading & Writing Program<br><i>(for ages 7-14)</i></span></span></span></b></span></span>
</p>
</div>
<div data-editorblocktype="Text" style="margin: 10px;">
<p><b><span lang="EN-US" style="font-size:10.5pt"><span style="font-family:"Arial",sans-serif"><span style="color:black">Our integrated Reading & Writing Program (Junior, Intermediate and Advanced levels) where our Enrichment teachers will assess the students' language and writing skills and identify areas for improvement in their coming school year. </span></span></span></b>
</p>
</div>
</th>
</tr>
</tbody>
</table>
</th>
</tr>
</tbody>
</table>
</th>
</tr>
</tbody>
</table>
</div>
<div data-section="true" class="emptyContainer columns-equal-class wrap-section">
<table class="outer" align="center" cellpadding="0" cellspacing="0" style="width: 600px; display: block;">
<tbody>
<tr>
<th style="padding-right: 10px; padding-bottom: 10px; padding-left: 10px;">
<table style="
width: 100%;
border-collapse: collapse;
" class="containerWrapper tbContainer" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<th data-container="true" class="columnContainer" data-container-width="100.00"
style="vertical-align: top; min-width: 5px; width: 580px; height: 0px;"
id="containerac3fd2f7fc9f61697091556086">
<table width="100%" cellpadding="0" cellspacing="0" style="height: 100%;">
<tbody>
<tr>
<th class="inner"
style="min-width: 5px; padding: 10px; vertical-align: top; word-wrap: break-word; word-break: break-word; font-weight: normal;">
<div data-editorblocktype="Button" align="center"
class="buttonWrapper"><a class="buttonClass"
href="https://www.baidu.com"
style="display: table-cell; width: 520px; height: 18px; max-width: 100%; line-height: normal; vertical-align: middle; background-color: rgb(51, 0, 153); mso-hide: none !important;"
data-msdyn-tracking-id="1ccaf699039311697083426080">
<span style="display: inline-block; min-width: 1px;">PROGRAM DETAILS</span>
</a></div>
</th>
</tr>
</tbody>
</table>
</th>
</tr>
</tbody>
</table>
</th>
</tr>
</tbody>
</table>
</div></body></html>
你复制秀米那种编辑器的模版生成的html，你自己写的html很多坑