时间戳

首页 > 解决方案 > 针对 Gmail 电子邮件的 Internet Explorer 特定媒体查询或黑客攻击

css - 针对 Gmail 电子邮件的 Internet Explorer 特定媒体查询或黑客攻击

问题描述

我正在处理电子邮件，并希望切换特定于浏览器的部分。请检查以下代码：

<!--Showing on Internet explorer-->
<table class="showing-on-ie-gmail">...</table>

<!--Showing on Chrome-->
<table class="showing-on-chrome-gmail">...</table>

有没有办法做到这一点？

任何帮助都非常感谢。

提前致谢！

标签： cssinternet-explorergmailmedia-querieshtml-email

解决方案

看起来您想根据浏览器应用特定的 CSS 类。

您可以参考下面的示例可能有助于识别 IE 和 Chrome。

识别 Internet Explorer 9 及更低版本：您可以使用条件注释为您想要明确定位的任何版本（或版本组合）加载特定于 IE 的样式表。如下所示，使用外部样式表。

<!--[if IE]>
  <link rel="stylesheet" type="text/css" href="all-ie-only.css" />
<![endif]-->

识别 Internet Explorer 10 和 11：使用 -ms-high-contrast 创建一个媒体查询，在其中放置 IE 10 和 11 特定的 CSS 样式。因为 -ms-high-contrast 是 Microsoft 特定的（并且仅在 IE 10+ 中可用），所以它只会在 Internet Explorer 10 及更高版本中解析。

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
     /* IE10+ CSS styles go here */
}

要识别 Google Chrome (29+)：

@media screen and (-webkit-min-device-pixel-ratio:0) and (min-resolution:.001dpcm) {
    .chrome {
        property: value;
    }
}

参考：

(1)如何在样式表中只定位 IE（任何版本）？

(2) CSS3 媒体查询仅针对 Internet Explorer（从 IE6 到 IE11+）、Firefox、Chrome、Safari 和/或 Edge

推荐阅读