如何在电子邮件的 html 跨度之间添加空格?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/16698412/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How do I add space between span in html for emails?
提问by starbucks
I am making email templates so I am limited with what I can do.
我正在制作电子邮件模板,所以我的能力有限。
I've got align="center" but I still need space between the two spans. How can I do this?
我有 align="center" 但我仍然需要两个跨度之间的空间。我怎样才能做到这一点?
CODE:
代码:
<td width="659" height="28" bgcolor="#999999" align="center">
<span style="color: #ffffff;font-family: Arial, sans-serif;font-size:20px;">
CODE:</span> <span style="color: #ffffff;font-family: Arial, sans-serif;
font-size:20px;font-weight:bold;">BEHAPPY</span><span style="color: #ffffff;
font-family: Arial, sans-serif;font-size:20px;">? Ends 6/01</span>
</td>
NOTE: I can't use margins or padding in email templates.
注意:我不能在电子邮件模板中使用边距或填充。
回答by John
Margin is not supported in all email clients. I've also had some slight inconsistencies in padding in the past, although it does work.
并非所有电子邮件客户端都支持保证金。过去我在填充方面也有一些轻微的不一致,尽管它确实有效。
Might seem like a hack (but isn't html for email that anyway?) - safest way in email is to use multiple
together like so:
.
可能看起来像一个黑客(但无论如何不是电子邮件的 html?) - 电子邮件中最安全的方法是
像这样一起使用多个:
.
I'd also use <font>
tags instead of <span>
, they are more consistent.
我也会使用<font>
标签而不是<span>
,它们更加一致。
回答by dsuess
is padding what you are looking for?
正在寻找什么填充?
span{
padding-left: 15px;
}
回答by Nishu Tayal
Try this CSS:
试试这个 CSS:
span{
margin-right: 10px;
}
Here is Demo: http://jsfiddle.net/84qyG/
这是演示:http: //jsfiddle.net/84qyG/
回答by Captain Skyhawk
Consider doing this:
考虑这样做:
<td width="659" height="28" bgcolor="#999999" align="center">
<span style="color: #ffffff;font-family: Arial, sans-serif;font-size:20px;">
CODE:</span> <span style="color: #ffffff;font-family: Arial, sans-serif;
font-size:20px;font-weight:bold;">BEHAPPY</span> <span style="color: #ffffff;
font-family: Arial, sans-serif;font-size:20px;">? Ends 6/01</span>
</td>
Notice the subtle & nbsp; between the spans.
注意细微之处 跨度之间。
Not sure why you can't use margins though. Also, is there a reason you're using td? I'm guessing it's part of a table?
不知道为什么你不能使用边距。另外,您是否有使用 td 的原因?我猜它是桌子的一部分?
回答by kshreve
I believe what you are actually looking for is
我相信你真正要找的是
display: block;
Ex. http://jsfiddle.net/kshreve/5jNGu/
前任。http://jsfiddle.net/kshreve/5jNGu/
Another way you could do this is to add <br/>
after the closing spans.
另一种方法是<br/>
在结束跨度之后添加。
Edit: You should also look into adding CSS classes to reduce the amount of redundant styling
编辑:您还应该考虑添加 CSS 类以减少冗余样式的数量
回答by hmhcreative
Either using multiple non-break-space characters or spacer image can solve your problem.
使用多个非中断空格字符或间隔图像可以解决您的问题。
<span style="">text #1</span><img src="images/spacer.gif" alt="" border="0" width="10" height="1" /><span style="">text #2</span>
回答by hmhcreative
You could use padding or margin: http://jsfiddle.net/tpXF4/
您可以使用填充或边距:http: //jsfiddle.net/tpXF4/
<td width="659" height="28" bgcolor="#999999" align="center">
<span style="color: #ffffff;font-family: Arial, sans-serif;font-size:20px;padding-right:30px;">
CODE:</span> <span style="color: #ffffff;font-family: Arial, sans-serif;
font-size:20px;font-weight:bold;">BEHAPPY</span><span style="color: #ffffff;
font-family: Arial, sans-serif;font-size:20px;">? Ends 6/01</span>
</td>
回答by Jim Bash
Consider inserting an empty div in between the 2 span tags?
考虑在 2 个 span 标签之间插入一个空的 div?
.spacer {
display: inline-block;
width: 10px;
}