2017-12-10 5 views
-1

템플릿을 가져 와서 사용자 지정했습니다. Chrome에 .html 파일을로드 할 때 Chrome에 배경색을 추가했지만 Outlook에서이 파일을로드하려고 할 때 배경색이 나타나지 않습니다. 나는 주위를 둘러 보았지만 HTML에 익숙하지 않았기 때문에 조용하게하지 않았고, 특히이 코드를 모두 작성하지 않았기 때문에 이러한 특정 상황에 대한 해답을 적용하는 방법을 이해할 수있었습니다. Outlook에서 배경색이 작동하지 않습니다.

${config_styles_link(color: #227700; text-decoration: none !important)} 
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
 
<html> 
 
    <head> 
 

 
    <meta http-equiv="content-type" content="text/html; charset=utf-8"> 
 
    </head> 
 
    <body> 
 

 
    <table cellpadding="0" border="0" style="line-height: 1.2em; font-family: 
 
    'Helvetica Neue', Helvetica, Arial, sans-serif; border-spacing: 0px; font- 
 
    size: 100%; font-color: white; border: 0; background-color: #fff;" 
 
    cellspacing="0" width="100%"> 
 
     <tbody> 
 
     <tr> 
 
      <td> 
 
      <table border="0" cellspacing="0" cellpadding="0" width="650" 
 
    align="center" style="line-height: 1.2em; font-family: 'Helvetica Neue', 
 
    Helvetica, Arial, sans-serif; border-spacing: 0px; font-size: 100%; 
 
    background-color: 252734; border: 1px solid #ccc; margin-top: 5px; margin- 
 
    bottom: 5px;" > 
 
      
 
    <tbody> 
 
       <tr> 
 
        <td style="padding: 16px 16px 0px 20px; vertical-align: middle; 
 
    font-size: 18px; color: grey;" align="left"> 
 
        </td> 
 
        <td width="200" style="padding:16px 16px 0px 14px;vertical- 
 
    align:middle; line-height:12px;" align="right"> 
 
        
 
        </td> 
 
       </tr> 
 
       <tr> 
 
        <td colspan="2" style="padding: 8px 16px 8px 20px;"> 
 
    <imgsrc="static.pexels.com/photos/11406/c12ee0f379643a278198b2086afd3b9c.jp"  
 
    style="width:600px;height:142px;"> 
 
    <p style= "color: D2D5EB">Hello ${user_first_name},</p> 
 
    <p style= "color: D2D5EB"> 
 
    We are looking forward to your participation in ${webcast_title}. 
 
    <div style="border:1px white; height: 60px; width: 180px; margin-left: 80px; 
 
    font-family: arial; font-size: 17px; font-weight: 600; color: D2D5EB; 
 
    background-color: 252734; clear:both;"> 
 
     ${webcast_details} 
 
    </div> 
 

 
    <img src="https://thumbs.dreamstime.com/z/skull-human-size-robot-isolated- 
 
    black-35652577.jpg" style="width:104px;height:142px;"> 
 

 

 

 
    </p> 
 
    <hr style="clear:both;"> 
 

 

 
    <p>&nbsp;</p> 
 

 
    <p style ="clear:both; color: D2D5EB;">You can test your system now to make 
 
    sure you can view our webinars and videos: ${help_viewers_systemtest}.</p> 
 

 
    <p style="color: D2D5EB;">${channel_webcasts}</p> 
 

 
    <p style ="font-family: arial; font-size: 11px; font-weight: 600; color: 
 
    grey; text-align: center;"> In the meantime you can check out our website by 
 
    clicking <a href="https://example.com/">here</a> for more 
 
    information about what we do, future events and to check out our blog!</p> 
 

 
    <p style="font-family: arial, sans-serif; font-size: 12px; color: 
 
    D2D5EB;">Thank you,<br /> 
 
        ${webcast_channel_title}</p> 
 
        </td> 
 
       </tr> 
 
       <tr> 
 
        <td style="padding: 0px 16px 0px 20px; font-family: 
 
    Arial,Helvetica,sans-serif; color: #000; font-size: 11px; color: D2D5EB;"> 
 
        <p>You received this email because you are subscribed to <a 
 
    style="color: D2D5EB;; text-decoration: none !important" 
 
    href="${webcast_channel_url}&utm_content=channel">${webcast_channel_title} 
 
    </a> on BrightTALK.</p> 
 
        </td> 
 
        <td width="120" style="padding:4px 16px 0px 0px;vertical- 
 
    align:top;" align="right"> 
 
        <img title="BrightTALK" 
 
    src="https://p.brighttalk.com/platform_email/brighttalklogo.png" 
 
    alt="BrightTALK" width="120" height="34" /> 
 
        </td> 
 
       </tbody> 
 
      </table> 
 
      <table border="0" cellspacing="0" cellpadding="0" width="650" 
 
    align="center" style="padding: 0px 0px; line-height: 1em;"> 
 
       <tbody> 
 
       <tr> 
 
        <td style="padding-top: 0px; font-family: Arial,Helvetica,sans- 
 
    serif; color: #000; font-size: 11px; background-color: 252734;"> 
 
    <p style="font-size:11px; color: D2D5EB">All times are shown in your time 
 
    zone: ${user_timezone_alias}</p> 
 
        <p style="color: D2D5EB;">To update your email preferences, 
 
    please visit: ${user_link_preferences}<br /> 
 
         Should you wish to unsubscribe from this channel please 
 
    visit: ${user_link_mybrighttalk}</p> 
 
        <p style="color: D2D5EB;"> 
 
         For more information, please visit us at <a style="color: 
 
    #227700; text-decoration: none !important" 
 
    href="http://www.brighttalk.com">www.brighttalk.com</a> <br /> 
 
         BrightTALK&trade;, 501 Folsom Street, 2nd Floor, San 
 
    Francisco, CA 94105</p> 
 
        <p style="color: D2D5EB;">${email_unsubscribe_link}</p> 
 
        </td> 
 
       </tr> 
 
       </tbody> 
 
      </table> 
 
      </td> 
 
     </tr> 
 
     </tbody> 
 
    </table> 
 
    </body> 
 
</html>

배경이 전망 흰색 나타납니다

은, 다른 모든 벌금을 변합니다. 배경색을 네이비 색상으로 지정하겠습니다. 당신이

background-color: #fff; 

변경 당신이 원하는 다른 색상의 #fff 화이트 색상을 가지고 있기 때문에

+0

당신은'배경-color'와'color' 스타일 규칙에 대한 16 진수 색상 코드의 여러 전에 해시 기호 ('#'를) 놓치고있어. –

답변

0

배경은 흰색 나타납니다. 예를 들어

시도 :

background-color: #0E061C;