Question

这很奇怪，我收到的邮件对css有以下定义：

<style type="text/css">
...NL-default {
    font-family: "Arial";
    font-size: 12px;
    color: #000000;
}
...style1 {
    font-family: "Arial";
    font-size: 12px;
    color: #0000FF;
}
...style4 {
    text-align: center;
    background-color: #F3F3F3;
    font-family: "Arial";
    font-size: 12px;
    color: #000000;
}
...style7 {
    text-align: center;
    color: #FFFFFF;
    background-color: #000080;
    font-family: "Arial";
    font-size: 12px;
    font-weight: bold;
}
...style14 {
    font-family: "Arial";
    font-size: 14px;
    color: #FF3300;
    font-weight: bold;
}

基本上所有款式都有三个时期。

它适用于这样的事情：

    <table style="width: 100%;" class="style41" cellSpacing="1" cellPadding="3">

        <tbody><tr>
            <td style="width: 233px;" class="style34" strong=""><strong>Notification</strong></td>

我相信大多数人的第一直觉可能是......这不会奏效，你是对的。在Chrome，Firefox和IE9上，CSS根本不适用于邮件正文。

然而，在IE8上，它得到了完美的应用，让我感到非常困惑。将三个句点放在CSS定义前面的目的是什么？为什么这只适用于IE8？

Answer 1

已知IE会将类选择器中的前导点视为常规类选择器，与it treats multiple class selectors as only the last in the chain一样，在怪癖模式下。

那说......这看起来像是一个非常丑陋的黑客。我甚至不确定它是否打算作为IE浏览器，因为代码看起来不像是仅供IE使用。在这种情况下，我不知道将引导期添加到邮件样式的真正目的是什么。

另外，我不确定为什么代码在IE9中不起作用，即使在怪癖模式下也是如此。以下测试用例肯定会使所有IE版本中的文本变为红色，包括9：

<html>
  <head>
    <style type="text/css">
    ...foo {
        color: #FF0000;
    }
    </style>
  </head>
  <body>
    <p class="foo">This text should not be red.</p>
  </body>
</html>

正如您可能已经猜到的，这不是有效的CSS。这就是为什么它在其他浏览器中不起作用，甚至在它们的怪癖模式中都不起作用。

CSS前面的三重周期

1 个答案: