如何删除HTML电子邮件周围的所有空白? [英] How can I remove all white space surrounding HTML email?
问题描述
我将以下html和css用作生成电子邮件的模板.
I've got the following html and css to be used as a template for generating e-mail messages.
但是,在我的邮政程序中接收电子邮件时,我的每面都留有一些白色的空白边缘.
But when it comes to receiving the e-mail on my postal programme I have a few pixels of white margins every side.
是否可以在使用div时将其删除,或者还有另一种方法来避免这些烦人的空格?
Is it possible to remove it while using divs or is there another way to avoid these annoying white spaces?
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>Lack of title</title>
<link href='https://fonts.googleapis.com/css?family=PT+Mono&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
<style>
body, html {
margin: 0!important;
padding: 0!important;
background-color: gray;
}
#nav {
height: 60px;
width: 100%;
background-color: #0078d7;
}
#content {
width: 1160px;
height: 800px;
background-color: #6f6767;
margin-left: auto;
margin-right: auto;
}
</style>
</head>
<body>
<div id="nav">
{title}
</div>
<div id="content">
{content}
</div>
</body>
推荐答案
不同的电子邮件客户端以不同的方式呈现HTML电子邮件.但是,您应该遵循一些基本做法(请参见下面的参考资料).
Different e-mail clients render HTML e-mails differently. But there are a few basic practices you should adhere to (see references below).
在查看代码时,很有可能是由于使用嵌入式样式而引起的问题.这是 MailChimp 所说的:
In looking at your code, there's a good chance your problem stems from the use of embedded styles. Here's what MailChimp has to say about that:
因为基于浏览器的电子邮件应用程序(例如Gmail)被剔除 默认情况下,
<head>
和<body>
标记始终在嵌入式上使用内联CSS CSS.
Because browser-based email applications, such as Gmail, strip out
<head>
and<body>
tags by default, always use inline CSS over embedded CSS.
因此,您的head
部分中的padding: 0
和margin: 0
可能会被忽略或覆盖.
So, the padding: 0
and margin: 0
in your head
section are possibly being ignored or overridden.
设计HTML电子邮件不同于设计HTML网站.电子邮件客户端和Web浏览器之间存在巨大的技术差距.好像浏览器在不断发展,但是电子邮件客户端陷入了1998年.
Designing HTML e-mails is not like designing HTML websites. There's a huge technology gap between e-mail clients and web browsers. It's as if browsers keep evolving, but e-mail clients are stuck in 1998.
在HTML电子邮件世界中,嵌入式和外部样式不好,内联样式很好,javascript不好,用于布局的表格很好.在这个世界上,老式的编码方法仍然存在并且很好.
In the world of HTML e-mail, embedded and external styles are bad, inline styles are good, javascript is bad, tables for layout are good. In this world, old-school coding methods are alive and well.
更多信息:
- CSS in HTML Email
- Best practices for styling HTML emails
- Best Practices & Considerations when writing HTML Emails
这篇关于如何删除HTML电子邮件周围的所有空白?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!