html - 跨电子邮件客户端 HTML 邮件 v:rect 按钮宽度为 100%
问题描述
我有这个丑陋的代码,用于在 MS Outlook 的 HTML 电子邮件中创建一个按钮:
<!--[if mso]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="https://www.website.com" target="_blank" style="height:50px;width:100%;v-text-anchor:middle;" stroke="f" fillcolor="#009CDE">
<w:anchorlock/>
<center>Watch the brand commercial</center>
</v:rect>
<![endif]-->
当我使用它的宽度时,600px
它确实有效。但是当我在 MS Outlook 中调整屏幕大小时,它没有响应。
但是,如果我使用 with of100%
它会中断。那么是否有可能以某种方式使用100%
onv:rect
元素的宽度?
解决方案
而不是width:100%
for v:rect,使用mso-width-percent:1000;
1000 = 100%
但是为什么要让自己头疼呢?创建一个可在 Outlook和其他任何地方使用的响应式按钮,您猜对了,它是一个表格!
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td class="one-column" style="padding-top:0;padding-bottom:0;padding-right:0;padding-left:0;border-collapse:collapse;">
<table width="100%" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;border-spacing:0;font-family:Arial, sans-serif;color:#333333;">
<tr>
<td style="padding-top:10px;padding-bottom:10px;padding-right:0;padding-left:0;border-collapse:collapse;">
<center>
<table border="0" cellpadding="0" cellspacing="0" style="margin:0 auto;">
<tbody>
<tr>
<td align="center" bgcolor="#D90432" width="200" style="-moz-border-radius: 0px; -webkit-border-radius: 0px; border-radius: 0px; padding-bottom: 15px; padding-left: 15px; padding-right: 15px; padding-top: 15px; border: none; line-height:20px;color:#ffffff;">
<a href="https://www.google.com.au" style="text-decoration: none;color:#ffffff;display:block;">Watch This</a>
</td>
</tr>
</tbody>
</table>
</center>
</td>
</tr>
</table>
</td>
</tr>
</tbody>
</table>
或者您可以只使用锚标记,但在 Outlook 中您会丢失背景。
推荐阅读
- flutter - 在颤动中动态分配图像
- ios - 从运行时可见的标签中获取字符串
- protocol-buffers - 扩展不同数量的字段时如何用 proto3 替换 proto2 扩展?
- r - 试图从百分比绘制堆积条形图
- swift - 如何创建全局导入以在所有应用程序中使用?
- javascript - 如何使用 cos-bilkent 布局控制断开节点的位置
- laravel - 如何在 laravel 黄昏中测试 jquery 脚本
- python - 将字符串传递给 RGB 颜色格式
- mysql - 什么相当于 MySQL 的 ST_DWithin (PostGIS - PostgreSQL)?
- database - SQLITE 编程