Html Mailchimp 模板中的圆角 - 基于 CSS 或图像
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/15174932/
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
Rounded corners in Mailchimp templates - CSS or image-based
提问by Sikander
I am creating an email template for Mailchimp. I have downloaded a template and am now placing my content per the requirements (I know about using Mailchimp template language). My problem is that I have to use rounded corners and am using image-based rounded corners.
我正在为 Mailchimp 创建一个电子邮件模板。我已经下载了一个模板，现在根据要求放置我的内容（我知道使用 Mailchimp 模板语言）。我的问题是我必须使用圆角并且正在使用基于图像的圆角。
When I edit the tables in the Mailchimp visual editor the image-based rounded corners become broken and no longer work.
当我在 Mailchimp 可视化编辑器中编辑表格时，基于图像的圆角会损坏并且不再起作用。
Should I use CSS, or image-based, rounded corners? Any suggestions please.
我应该使用 CSS 还是基于图像的圆角？请提出任何建议。
*EDIT :Always use images This is what i got as best solution..
*编辑：始终使用图像这是我得到的最佳解决方案..
采纳答案by John
Use images, they are 100% supported. Example hereof how to do it correctly.
使用图像，它们是 100% 支持的。此处示例说明如何正确执行此操作。
You'll need to upload the corner images to be hosted either by Mailchimp or your own URL. If they are, Mailchimp may be reformatting your code. Not sure if it is a wysiwyg as I'm not a Mailchimp user, but you can always edit the output code to put the image URL's back if that is the case.
您需要上传由 Mailchimp 或您自己的 URL 托管的角落图像。如果是，Mailchimp 可能正在重新格式化您的代码。不确定它是否是所见即所得，因为我不是 Mailchimp 用户，但如果是这种情况，您可以随时编辑输出代码以将图像 URL 放回原处。
回答by Brett DeWoody
Mailchimp uses CSS-based rounded corners in their Email Blueprint templates. Here's a chart from CampaignMonitorshowing some of the email clients border-radius(and the -mozand -webkitprefixes) will/won't work in.
Mailchimp 在其电子邮件蓝图模板中使用基于 CSS 的圆角。这是来自 CampaignMonitor的图表，显示了一些电子邮件客户端border-radius（以及-moz和-webkit前缀）将/不会工作。
The CSS-based rounded corners won't work in everyemail client, but will fail gracefully in clients that don't support the border-radius property. Image-based rounded corners will not display when a reader doesn't have images enabled, and as you've experienced, maintaining the image-based rounded corners in the MailChimp visual editor can be tough depending on how your template is setup.
基于 CSS 的圆角不适用于每个电子邮件客户端，但在不支持 border-radius 属性的客户端中会正常失败。当阅读器未启用图像时，将不会显示基于图像的圆角，正如您所经历的，在 MailChimp 可视化编辑器中维护基于图像的圆角可能很困难，具体取决于您的模板设置方式。
My suggestion would be for CSS-based rounded corners, using the prefixes to cover the widest range of email clients:
我的建议是基于 CSS 的圆角，使用前缀来覆盖最广泛的电子邮件客户端：
border-radius: 4px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
