Outlook 2007/10/13 <style media=“print”> wor

2019-07-08 22:33发布

站内问答 / HTML/CSS
1576 1 6

I've encountered something that bugged me while testing my email marketing campaigns.

So here goes:

I use the following code so that images and some other bits won't print when a user prints the e-mail (It is for a hotel group so emails are printed often, with booking numbers and all).

<style media="print">
body { background-color:#FFFFFF; }
.no-print { display:none; }
</style>

Now, outlook 2007/10/13, aol mail and some other clients seem to consider themselves as printed media and apply the display:none rule on every no-print element, leaving the email in a dire state of emptiness.

I could remove it all completely, but that wouldn't be good practices for ecology.

Do any of you guys know of a work around? Like a way to force outlook to consider itself as a screen media?

Thanks a lot.

1条回答
干净又极端
2楼-- · 2019-07-08 23:34

Now that I have a better understanding of the question I think I found the beginning of a possible solution for you. This should ensure the printer style sheets CSS still work, but aren't displayed by clients, like Outlook 2007, when they shouldn't be.

  • Ran test with email 'as is' and sure enough Outlook 2007 was blank because it applied the print style sheets
  • Then I added this media query in the code example below
  • Outlook 2007 shows up with the other clients so it's ignoring the print stylesheet
  • Now in Google Chrome's print preview the text with .no-print doesn't display

Code Excerpt:

    <style media="print">

        @media only print {
            body { background-color:#FFFFFF; }
           .no-print { display:none; }
         }

    </style>

    </head>

<body >
<h1 class="no-print" style="font-size: 36px">LINE OF TEXT</h1>

Email Testing Link: https://litmus.com/pub/49bfd3b

查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(6)