我尝试了下面的链接。
http://www.pardot.com/faqs/html-css/optimizing-forms-on-mobile-devices/
它说我可以在Layout模板下，从Twitter Boostrap CSS / LESS样式表到Pardot的表单样式表使用相同的CSS3媒体查询。
但是，当我尝试在布局模板中编写此媒体查询时。
@media (max-width: 480px) {
// some CSS code here from Boostrap
}
然后在我的浏览器中查看它。没用！
就像是由于其Pardot的内部iframe设置在移动设备上重新缩放浏览器时，好像无法检测到我的Bootstrap CSS3样式表。
有人可以指出通过这种集成可以完成移动响应吗？
最佳答案
您需要在Pardot表单布局模板中包含指向Bootstrap样式表的链接。
添加https://github.com/davidjbradshaw/iframe-resizer可使iframe响应并自动垂直调整大小，这在您遇到表单错误或表单高度增加或缩小以用于确认或条件字段时非常有用。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<meta name="description" content="%%description%%"/>
<title>%%title%%</title>
<link rel="stylesheet" href="https://yourdomain.com/media/styles/bootstrap.min.css">
</head>
<body>
%%content%%
<!-- Use iframe resizer to allow this form to resize itself in the parent page -->
<script src="https://yourdomain.com/media/scripts/iframeResizer.contentWindow.min.js"></script>
</body>
</html>