Question

我正在尝试使用来自广告投放的响应式电子邮件来查看我们看到的一些问题。有时，我们的广告附带第三方脚本，可提供1x1跟踪像素。我们使用全局规则来调整图像大小... img {width：100％; height：auto;}并且我们无法使用类或ID来定位此跟踪像素。我正在尝试使用第n个子选择器来至少在移动设备上正确地调整跟踪像素的大小，因为它们在很大程度上可以支持那种类型的CSS，但是，我没有正确地编写它。任何帮助将不胜感激。

http://jsfiddle.net/pxdunn/jk8EC/

HTML：

<td align="center" bgcolor="#ffffff" class="ad-728">
    <font style="font-family:Arial,Helvetica,sans-serif;color:#858585;font-size:10px;text-transform:uppercase;line-height:13px;display:block;" align="center">Advertisement</font>
    <table>
        <tbody>
            <tr>
                <td width="100%" height="2" style="line-height:2px;font-size:2px;">&nbsp;</td>
            </tr>
        </tbody>
    </table>
    <a href="http://oascentral.modernhealthcare.com/RealMedia/ads/click_lx.ads/mhoemail/jcr_dd_1113/102920131102/x19/crain/MHO_EZ_JOINTCOMM_DD_728_1113/Savelivessavemoney-Ad_ModernHealthcare_10-11-2013-2.jpg/1" target="_blank">
        <img src="http://oascentral.modernhealthcare.com/RealMedia/ads/adstream_nx.ads/mhoemail/jcr
_dd_1113/102920131102@x19" border="0"/>
    </a>
    <a href="#">
        <img src="http://placehold.it/1x1/"/>
    </a>
</td>

CSS：

img {width:100%;height:auto;}
td[class="ad-728"] img:nth-child(n+2) {width:1px!important;max-width:1px!important;}

Answer 1

html电子邮件中的第N个子级和其他CSS伪类是limited in support。最好的办法是创建一个小桌子并将跟踪链接/图像放在那里。 1像素的100％是1像素...

如果您无法选择跟踪代码的位置（例如，动态添加发送），则必须重新考虑自动100％策略。

另外，请记住，也不完全支持在样式标记中声明100％ - 您应该内联CSS。

在移动电子邮件中选择第n个子元素

1 个答案: