Визуализация электронной почты в формате HTML в Outlook — VML

Я создал электронное письмо в формате HTML, и при просмотре в Outlook 2007 я не мог видеть некоторые изображения, поскольку они были фоном. Я сделал кое-какой хак, используя VML, однако он не позволяет мне оставить значение высоты пустым, так как по умолчанию оно равно 100px, или я не могу поставить авто или процент. Фоновое изображение должно иметь возможность изменять размер в зависимости от размера текста, чтобы на нем отображался весь текст.

Это код, который у меня работает, за исключением значений высоты.

<td colspan="6" align="center" valign="top" style="background-image: url('http://example.com/content_centre.png');" background="http://example.com/content_centre.png">
     <!--[if gte mso 9]>
        <v:rect xmlns:v="urn:schemas-microsoft-com:vml" style="width:620px;height:200px;" strokecolor="none">
          <v:fill xmlns:v="urn:schemas-microsoft-com:vml" type="tile" color="#DDDDDD" src="http://example.com/content_centre.png" /></v:fill>
        </v:rect>
        <v:shape xmlns:v="urn:schemas-microsoft-com:vml" id="theText" style="position:absolute;width:620px;height:200px;">
    <![endif]-->
    <table cellspacing="0" cellpadding="0" border="0" style="width:100%;"><tr>
        <td width="30"></td>
        <td align="left" style="font-family:Arial, Helvetica, sans-serif; background:#ffffff; ">
            <p>This is where the text will appear. Doesn’t matter how much text it just stops displaying it.</p></td>
        <td width="30"></td>
    </tr>
    </table>
    <!--[if gte mso 9]>
        </v:shape>
    <![endif]-->
    </td>

Любая помощь будет оценена по достоинству.


html email outlook html-email vml
person Josh Pullin    schedule 02.08.2012    source источник
comment
Я дал ответ на этот вопрос здесь, надеюсь, он вам поможет: stackoverflow.com/questions/23280715/   -  person davidcondrey    schedule 07.05.2014

Ответы (1)


arrow_upward
1
arrow_downward

Использовать:

<v:image xmlns:v="urn:schemas-microsoft-com:vml" id="theImage" style='behavior: url(#default#VML); display:inline-block; position:absolute; height:200px; width:620px; top:0; left:0; border:0; z-index:1;' src="http://example.com/content_centre.png"/>

Скорее, чем:

<v:rect

А затем в вашем «v: shape» измените высоту на «авто», это сработало для меня в OL2007. принимая во внимание, что мой пример основан на области с содержимым, превышающим 100 пикселей, поэтому я не уверен, что по умолчанию он по-прежнему имеет минимальное значение 100 пикселей, если вам нужно, чтобы оно было меньше, установите максимальную высоту в "v: shape" ниже 100 пикселей (но, очевидно, это предотвратит масштабирование до содержимого)

person Alex Barber    schedule 20.08.2012