HTML无法在电子邮件中正确显示

Gre*_*ver 2 html css html-email

HTML:

<div id="container">
    <div id="social-links">
        <img src="http://www.collegify.com/emailer/roads/delhi/images/Promotional_03.jpg" alt="">
        www.twitter.com/roadsprep
        <br />
        <img src="http://www.collegify.com/emailer/roads/delhi/images/Promotional_09.jpg" alt="">
        www.facebook.com/roadsprep
    </div>
    <div id="website-link">www.roadsprep.com</div>
    <div id="now-at-gurgaon">
        NOW AT
        <BR />
        GURGAON
    </div>
    <div id="gray-box">
        We specialize in
        <br />
        SAT, GRE, GMAT, ACT
        <br />
        IELTS and TOEFL coaching!
    </div>
    <div id="pointers">
        <ul>
            <li>Over 6 years of Test Prep Experience!</li>
            <li>Over 300 students with 2100 + scores</li>
            <li>On average, an improvement of 400 point improvement in scores</li>
        </ul>
    </div>
    <div id="contact-info">
        <strong>Roads Academy Private Limited</strong>
        <br />
        Office No. 4001, Basement, DLF Phase IV, Near, Galleria Market, Gurgaon - 122 009, Haryana
        <br />
        <strong>Phone:</strong>
        +91 85100 66662
        <strong>Email:</strong>
        support@roadsprep.com
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

CSS:

<div id="container">
    <div id="social-links">
        <img src="http://www.collegify.com/emailer/roads/delhi/images/Promotional_03.jpg" alt="">
        www.twitter.com/roadsprep
        <br />
        <img src="http://www.collegify.com/emailer/roads/delhi/images/Promotional_09.jpg" alt="">
        www.facebook.com/roadsprep
    </div>
    <div id="website-link">www.roadsprep.com</div>
    <div id="now-at-gurgaon">
        NOW AT
        <BR />
        GURGAON
    </div>
    <div id="gray-box">
        We specialize in
        <br />
        SAT, GRE, GMAT, ACT
        <br />
        IELTS and TOEFL coaching!
    </div>
    <div id="pointers">
        <ul>
            <li>Over 6 years of Test Prep Experience!</li>
            <li>Over 300 students with 2100 + scores</li>
            <li>On average, an improvement of 400 point improvement in scores</li>
        </ul>
    </div>
    <div id="contact-info">
        <strong>Roads Academy Private Limited</strong>
        <br />
        Office No. 4001, Basement, DLF Phase IV, Near, Galleria Market, Gurgaon - 122 009, Haryana
        <br />
        <strong>Phone:</strong>
        +91 85100 66662
        <strong>Email:</strong>
        support@roadsprep.com
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

网页字体的头部代码:

<link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700' rel='stylesheet' type='text/css'>
Run Code Online (Sandbox Code Playgroud)

这在浏览器中完美显示,但在电子邮件中不起作用。我知道我不仅可以将代码粘贴到电子邮件中,还需要在浏览器中预览它,直接从那里复制它,然后将其粘贴到电子邮件正文中,但是无法正确显示。我正在使用Gmail。

Ric*_*d B 5

电子邮件倾向于去除标题内容,因此您不太可能为新字体添加外部链接。

通常,要使电子邮件中的html尽可能简单,因为它们呈现html的能力受到限制(尤其是Outlook)。请记住,您将(可能)将其发送给各种电子邮件客户端-它们都将略有不同。

这应该有所帮助:https : //www.campaignmonitor.com/css/