html - 在响应式电子邮件上使用 block 属性跨度

标签 html css email

我正在为我的公司构建响应式模板并引用 PSD 作为模板的基础。

设计师对间距非常挑剔(自然)。

我正在尝试找到一种方法来控制行高无法切割的区域中的间距。

我正在尝试控制副标题与其下方的正文副本之间的间距。一个
不够,其中 2 个太多了。还有一张图像左对齐到副本的左侧。

我的想法是这样的:

<span style="display:block; height:10px;">&nbsp;</span>

您对上述解决方案有何看法?认为它会通过 Outlook 测试?

这是 the code in jsFiddle .

最佳答案

使用具有 px 或 em 值的 padding-bottom 属性。 例如:padding-bottom: 20px;

因此,这是更新后的代码,在标题文本和正文之间添加了空格。

<span style="font-family: Arial, sans-serif; font-size: 30px; color: #254271; text-align:left; line-height:30px; display:block; letter-spacing:-1px; font-weight:bold; text-transform:uppercase; **padding-bottom: 45px;**">Excepteur sint occaecat cupidatat non proident</span><br /> 

完整更新:

http://jsfiddle.net/55nkc0t3/1/

关于html - 在响应式电子邮件上使用 block 属性跨度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25392941/

相关文章:

jquery - 微小的滚动条自动高度

javascript - Etch-A-Sketch(JavaScript) 随机颜色和删除功能不起作用

html - 如何在偏移量处向跨度添加边框

java - 通过java在特定日期发送自动邮件

java - "text/plain; charset=ISO-8859-2"电子邮件正文类型中的新行

java - 通过 smtps 发送邮件时出错

javascript - 如何在 Canvas 上创建不同的文字艺术设计?

css - <pre> 与滚动文本保持不同的行

html - 当外部 div 宽度动画为 0px 时保留内部 div 宽度

html - CSS 从 Outlook Online 中的单个 div 元素中剥离