Nano Hash - криптовалюты, майнинг, программирование

Outlook 2010 изменяет размер электронной почты HTML, но не изображения

В настоящее время я создаю шаблон электронной почты, но одно из изображений неправильно отображается в Outlook, независимо от того, сколько руководств я просматриваю, чтобы исправить проблему масштабирования.

Превью показаны ниже;

Электронная почта во всех остальных клиентах;

введите здесь описание изображения

Электронная почта в Outlook 2010;

введите здесь описание изображения

Это сводит меня с ума, я вручную закодировал ниже, потому что все, что сгенерировано самостоятельно, похоже, не работает. Ширина изображения, которую я пробовал вручную, равна 600 пикселей, а во встроенном стиле - ширина: 600; а теперь 100% - вообще ничего не исправить..

БУДУ ОЧЕНЬ ЦЕННА ЛЮБАЯ ПОМОЩЬ! ‹3

электронная почта в формате HTML;

<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:v="urn:schemas-microsoft-com:vml"
xmlns:o="urn:schemas-microsoft-com:office:office">

<head>
<!--[if gte mso 9]><xml>
<o:OfficeDocumentSettings>
<o:AllowPNG/>
<o:PixelsPerInch>96</o:PixelsPerInch>
</o:OfficeDocumentSettings>
</xml><![endif]-->



<style type="text/css">

table {border-collapse:separate;}

a:hover {text-decoration: underline;}

.ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td {line-height: 100%}

.ExternalClass {width: 100%;
}

a {
    text-decoration: none;
color: #606060 !important;
word-wrap: break-word;
}

a:hover {text-decoration: underline;}


h1{
        color:#202020;
        font-family:Helvetica;
        font-size:26px;
        font-style:normal;
        font-weight:bold;
        line-height:125%;
        letter-spacing:normal;
    }
 h2{
        color:#202020;
        font-family:Helvetica;
        font-size:22px;
        font-style:normal;
        font-weight:bold;
        line-height:125%;
        letter-spacing:normal;
    }
 h3{
        color:#202020;
        font-family:Helvetica;
        font-size:20px;
        font-style:normal;
        font-weight:bold;
        line-height:125%;
        letter-spacing:normal;
    }
 h4{
        color:#202020;
        font-family:Helvetica;
        font-size:18px;
        font-style:normal;
        font-weight:bold;
        line-height:125%;
        letter-spacing:normal;
    }


 </style>

 </head>


 <body width="600" style="background-color:#fafafa;">


 <table border="0" cellpadding="0" cellspacing="0" width="600" align="center" style="text-align: center; background-color: white; mso-cellspacing: 0px; mso-padding-alt: 0px 0px 0px 0px;width: 600px;" >
 <tbody>
 <tr>
 <td style="padding-left: 18px;padding-bottom: 9px;color: #656565;font-family: Helvetica;font-size: 12px;text-align: left; width: 400px; background-color:#fafafa;" valign="top" width="400">

                        Podcast updates from Liberty Entrepreneurs.
 </td>
 <td style="padding-right: 18px;padding-bottom: 9px;color: #656565;font-family: Helvetica;font-size: 12px;text-align: right;width: 200px; background-color:#fafafa;" valign="top" width="200">
 <a href="*|ARCHIVE|*">View this email in your browser</a>
 </td>
 </tr>
                        <!-- BEGIN HEADER IMAGE // -->
 <tr>
 <td colspan="2" width="600"  style="width: 600px;  margin: auto;">
 <img alt="Liberty Entrepreneurs" style="width:100%; min-width:100% !important; margin: auto;" src="https://gallery.mailchimp.com/419f286c8164643c78599a0cd/images/9b764c71-111e-4ef2-8792-d9a223a7da3b.jpg" width="100%">
 </td>
 </tr>


                        <!-- BEGIN COLUMNS // -->
 <tr>
 <td colspan="2" valign="top"  style="width: 600px;" width="600">

 <table border="0" cellpadding="0" cellspacing="0" width="600" align="center" style="text-align: center; background-color: white; mso-cellspacing: 0px; mso-padding-alt: 0px 0px 0px 0px; width: 600px;" >
 <tbody>
                        <!-- BEGIN LEFT COLUMN // -->
 <tr>
 <td width="200" valign="top" style="width: 200px; ">
                            <!-- BEGIN LEFT MENU NAV // -->
                       <a href="http://libertyentrepreneurs.com/">             <img alt="home" src="https://gallery.mailchimp.com/419f286c8164643c78599a0cd/images/8836768d-61cf-4687-9598-37bc518b2cd9.jpg" style="width: 200px;" width="200"></a><br>

                         <a href="http://libertyentrepreneurs.com/podcasts/">  <img alt="podasts" src="https://gallery.mailchimp.com/419f286c8164643c78599a0cd/images/ee8755e0-000d-48bd-adb8-851c1a7497fa.jpg" style="width: 200px;" width="200"></a><br>

                          <a href="http://libertyentrepreneurs.com/about/">        <img alt="about-us" src="https://gallery.mailchimp.com/419f286c8164643c78599a0cd/images/3078d9ff-01ec-431d-a9eb-e9024f371498.jpg" style="width: 200px;" width="200"></a><br>

                           <a href="http://libertyentrepreneurs.com/affiliates/">        <img alt="affiliates" src="https://gallery.mailchimp.com/419f286c8164643c78599a0cd/images/49888d30-b006-4d1b-8e85-18286f16252e.jpg" style="width: 200px;" width="200"></a><br>
                <!-- // END LEFT MENU NAV -->

             <br>
    <!-- BEGIN LEFT MENU SOCIAL ICONS // -->
 <table align="center" style="mso-cellspacing: 0px; mso-padding-alt: 0px 0px 0px 0px;">
 <tbody>
 <tr>

 <td ><a href="https://www.facebook.com/LibertyEntrepreneurs"><img alt="facebook" src="https://gallery.mailchimp.com/419f286c8164643c78599a0cd/images/c390cefe-929f-49cc-aa83-8906f2541988.jpg"></a></td>

    <td ><a href="http://feeds.soundcloud.com/users/soundcloud:users:179898940/sounds.rss"><img alt="rss" src="https://gallery.mailchimp.com/419f286c8164643c78599a0cd/images/bb275fe4-7220-4814-bf68-c644a973f7ce.jpg"></a></td>

 <td >
 <a href="https://twitter.com/libertyepodcast">
 <img alt="twitter" src="https://gallery.mailchimp.com/419f286c8164643c78599a0cd/images/38a2439b-b92b-47be-952c-69d3acab18fd.jpg"></a></td>

 </tr>
 <tr>

 <td >
 <a href="https://www.youtube.com/channel/UCwVUvM9zHMtfFebUpRMn2iA">
 <img alt="youtube" src="https://gallery.mailchimp.com/419f286c8164643c78599a0cd/images/94a00983-d179-4d53-8ed6-2cfdb7b043ba.jpg"></a></td>

 <td >
 <a href="https://plus.google.com/113882469509229437540">
 <img alt="google" src="https://gallery.mailchimp.com/419f286c8164643c78599a0cd/images/debb5fb8-f62f-488a-b19a-425e11b54b39.jpg"></a></td>

<td >
<a href="mailto:[email protected]">
<img alt="email" src="https://gallery.mailchimp.com/419f286c8164643c78599a0cd/images/2e84304b-9dce-47a6-b10b-7b8831f0f5e6.jpg"></a></td>

</tr>
</tbody>
</table>
 <!-- // END LEFT MENU SOCIAL ICONS -->

 <!-- BEGIN LEFT MENU DONATION BUTTONS // -->

 <h3 style="text-align: center;font-family: Open Sans;color: #f7931d;"><span style="color: #f7931d;"><strong>Donate $1 with Altcoins</strong></span></h3>

 <a href="https://shapeshift.io/shifty.html?destination=18S1ggqLUdVFzUNbmYcthnG3S8WSYP1ShA&output=BTC&apiKey=e6c44e9af4ec65d0bdce028b4b984f43a0bf519f9c984a3005190068354285606cea430cb7d81c21e1aca85b8e8e93115db1d65d4c057dd84318f0f6529a6009&amount=$1" target="_blank" >
 <img width="144px" align="middle" src="https://gallery.mailchimp.com/419f286c8164643c78599a0cd/images/3a605f6d-c526-4c68-93dd-791f8296ee88.png" style="width: 144px;" >
 </a>
 <br>
 <br>

 <a href="https://itunes.apple.com/us/podcast/liberty-entrepreneurs-podcast/id1057809945?mt=2" target="_blank">
 <img width="144px" align="middle" src="https://gallery.mailchimp.com/419f286c8164643c78599a0cd/images/dcb329f4-124a-47ba-aeb6-63fa995d93d3.png" style="width: 144px;" >
 </a>
 <br>

  <!-- // END LEFT MENU DONATION BUTTONS -->

 <br>

  <!-- BEGIN LEFT MENU RECENT ARTCLES // -->

  <h3 style="font-family: Helvetica;font-style: normal;font-weight: bold;letter-spacing: -1px;text-align: center;color: #606060 !important;">
 <center>Recent Articles:</center>
 </h3>
 <p style="text-align: left;">*|RSS:RECENT|*</p>

 <!-- // END LEFT MENU RECENT ARTCLES -->
    </td>

                            <!-- BEGIN RIGHT COLUMN // -->
 <td width="400" valign="top" style="width: 400px;">
 <br>

                        *|RSSITEMS:|*
 <h3 class="mc-toc-title" style="margin: 0;padding: 0;display: block;font-family: Helvetica;font-style: normal;font-weight: bold;line-height: 125%;letter-spacing: -1px;color: #606060 !important;">&gt;<a href="*|RSSITEM:URL|*" target="_blank">*|RSSITEM:TITLE|*</a></h3>
 <em>By *|RSSITEM:AUTHOR|* on *|RSSITEM:DATE|*</em><br>
 *|RSSITEM:CONTENT_FULL|*<br>
  <a href="*|RSSITEM:URL|*" target="_blank">Read in browser &raquo;    </a><br>
    *|RSSITEM:TWITTER|* *|RSSITEM:LIKE|*<br>
   <br>
  *|END:RSSITEMS|*

 </td>
 <!-- // END RIGHT COLUMN -->
 </tr>
 </tbody>
 </table>

 </td>
 </tr>

 <tr>
    <!-- BEGIN FOOTER SOCIAL ICONS // -->
 <td colspan="2" style="padding-top: 10px; padding-bottom: 10px; margin: auto; border-top: 2px solid #eaeaea; width: 600px; background-color:#fafafa;" width="600">
                                                                              <a target="_blank" href="https://www.facebook.com/LibertyEntrepreneurs"><img width="24" height="24" src="https://cdn-images.mailchimp.com/icons/social-block-v2/color-facebook-48.png"></a>

 <a target="_blank" href="http://feeds.soundcloud.com/users/soundcloud:users:179898940/sounds.rss"><img width="24" height="24" src="https://cdn-images.mailchimp.com/icons/social-block-v2/color-rss-48.png"></a>

 <a target="_blank" href="https://www.twitter.com/libertyepodcast/"><img width="24" height="24" src="https://cdn-images.mailchimp.com/icons/social-block-v2/color-twitter-48.png"></a>

 <a target="_blank" href="https://www.youtube.com/channel/UCwVUvM9zHMtfFebUpRMn2iA"><img width="24" height="24" src="https://cdn-images.mailchimp.com/icons/social-block-v2/color-youtube-48.png"></a>

 <a target="_blank" href="https://plus.google.com/113882469509229437540"><img width="24" height="24" src="https://cdn-images.mailchimp.com/icons/social-block-v2/color-googleplus-48.png"></a>

 <a target="_blank" href="mailto:[email protected]"><img width="24" height="24" src="https://cdn-images.mailchimp.com/icons/social-block-v2/color-forwardtofriend-48.png"></a>

 </td>
                                <!-- // END FOOTER SOCIAL ICONS -->
 </tr>


 </tbody>
 </table>

 </body>
 </html>
html css email outlook
20.03.2016

  • Просто чтобы уточнить, это происходит после того, как вы отправляете электронное письмо? Как в электронном письме правильно отображается перед отправкой? 20.03.2016
  • да, действительно, просмотрите предварительный просмотр, прежде чем Outlook отобразит HTML: freshlondon.biz/testing/libertyentrepreneurs/< /а> 20.03.2016

Ответы:


1

У меня есть два возможных решения (исходя из предположения, что внешний вид ломает изображение при встраивании):

  1. #P2#
    #P3# #P4# #P5#
    #P6#
  2. Рендеринг изображения с разрешением 96 dpi. Как я упоминал выше, Outlook, кажется, повторно встраивает изображения. Кажется, они хотят, чтобы они были 96 точек на дюйм, поэтому будут конвертировать их (часто вызывая проблемы). Если вы вставите изображение с правильным разрешением, есть шанс, что Outlook не сломает его при преобразовании.
20.03.2016
  • Вторая часть — отличное знание для всех, кто отправляет маркетинговые электронные письма. Спасибо 13.01.2019

    • 2

    Я вижу, где вы пытались присвоить min-width самому изображению, но пытались ли вы присвоить его родительскому <tr> или <td>?

    <tr>
    <td colspan="2" width="600"  style="width: 600px;  margin: auto; min-width: 600px;">
        <img alt="Liberty Entrepreneurs" style="width:100%; min-width:100% !important; margin: auto;" src="https://gallery.mailchimp.com/419f286c8164643c78599a0cd/images/9b764c71-111e-4ef2-8792-d9a223a7da3b.jpg" width="100%">
    </td>
</tr>

    Также стоит попытаться указать height (вместе с width) самого <image>, поскольку известно, что механизм Outlook настраивает изображение по своему усмотрению, если вы не укажете оба. Эти размеры должны совпадать с фактическими размерами изображения (которые вы правильно использовали в отношении width).

    20.03.2016
    Новые материалы
    Кластеризация: более глубокий взгляд
    Кластеризация — это метод обучения без учителя, в котором мы пытаемся найти группы в наборе данных на основе некоторых известных или неизвестных свойств, которые могут существовать. Независимо от..
    Как написать эффективное резюме
    Предложения по дизайну и макету, чтобы представить себя профессионально Вам не позвонили на собеседование после того, как вы несколько раз подали заявку на работу своей мечты? У вас может..
    Частный метод Python: улучшение инкапсуляции и безопасности
    Введение Python — универсальный и мощный язык программирования, известный своей простотой и удобством использования. Одной из ключевых особенностей, отличающих Python от других языков, является..
    Как я автоматизирую тестирование с помощью Jest
    Шутка для победы, когда дело касается автоматизации тестирования Одной очень важной частью разработки программного обеспечения является автоматизация тестирования, поскольку она создает..
    Работа с векторными символическими архитектурами, часть 4 (искусственный интеллект)
    Hyperseed: неконтролируемое обучение с векторными символическими архитектурами (arXiv) Автор: Евгений Осипов , Сачин Кахавала , Диланта Хапутантри , Тимал Кемпития , Дасвин Де Сильва ,..
    Понимание расстояния Вассерштейна: мощная метрика в машинном обучении
    В обширной области машинного обучения часто возникает необходимость сравнивать и измерять различия между распределениями вероятностей. Традиционные метрики расстояния, такие как евклидово..
    Обеспечение масштабируемости LLM: облачный анализ с помощью AWS Fargate и Copilot
    В динамичной области искусственного интеллекта все большее распространение получают модели больших языков (LLM). Они жизненно важны для различных приложений, таких как интеллектуальные..