#html #css #ios #gmail #signature
#HTML #css #iOS #gmail #подпись
Вопрос:
Я создаю HTML-подпись, которая хорошо работает на настольных и мобильных устройствах Outlook и на настольном компьютере Gmail. Я застрял на том, чтобы она выглядела красиво в приложении Gmail для iOS. Подпись должным образом уменьшена в Outlook Mobile: шрифты, изображения уменьшаются, а таблица, в которой расположена подпись, занимает всю ширину.
Но в приложении Gmail она не масштабируется: изображения и шрифты имеют тот же размер, что и на рабочем столе, и все выглядит плохо, смотрите скриншот здесь.
Вот код:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE>Email Signature</TITLE>
<META content="text/html; charset=utf-8" http-equiv="Content-Type">
<style type="text/css">
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
src: local('Open Sans Regular'), local('OpenSans-Regular'), url(http://fonts.gstatic.com/s/opensans/v17/mem8YaGs126MiZpBA-UFVZ0d.woff) format('woff');
mso-font-alt: 'Arial'; }
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 700;
src: local('Open Sans Bold'), local('OpenSans-Bold'), url(http://fonts.gstatic.com/s/opensans/v17/mem5YaGs126MiZpBA-UN7rgOUuhv.woff) format('woff');
mso-font-alt: 'Arial'; }
}
</style>
</HEAD>
<BODY style="font-size: 10pt; font-family: 'Open Sans', Arial, sans-serif;">
ddd
<table style="width: 525px; font-size: 11pt; font-family: 'Open Sans', Arial, sans-serif;" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td width="150" style="font-size: 10pt; font-family: 'Open Sans', Arial, sans-serif; width: 150px; padding-right: 10px; vertical-align: top;" valign="top" rowspan="6"> <a href="https://avanti.ca/" target="_blank"><img class="profilepic" border="0" alt="Profile picture" width="150" style="width:150px; height:auto; border:0;" src="https://avanti.ca/signatures/images/userpic.png"></a>
</td>
<td style="padding-left:10px">
<table cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="font-size: 10pt; color:#009787; font-family: 'Open Sans', Arial, sans-serif; width: 400px; padding-bottom: 5px; padding-left: 10px; vertical-align: top;" valign="top">
<strong><span style="font-size: 12pt; font-family: 'Open Sans', Arial, sans-serif; color:#009787;">Farkhod Fayzullaev</span></strong><span><br></span>
<strong style="font-family: 'Open Sans', Arial, sans-serif; font-size:8pt; color:#333333; text-transform:uppercase;letter-spacing:1px;">Digital Marketing Manager</strong><span><br></span>
<span style="font-family: 'Open Sans', Arial, sans-serif; font-size:10pt; color:#333333;">403-555-7895 ext 112</span>
</td>
</tr>
<tr>
<td style="font-size: 10pt; color:#333333; font-family: 'Open Sans', Arial, sans-serif; padding-bottom: 5px; padding-top: 5px; padding-left: 10px; vertical-align: top; line-height:19px;" valign="top"> <strong><span> <span style="font-family: 'Open Sans', Arial, sans-serif; font-size:11pt; color:#333333;">Avanti Software</span> </span></strong> <span><br></span> <span><span style="font-size: 11pt; font-family: 'Open Sans', Arial, sans-serif; color:#333333;">Build a Better Workplace</span></span>
</td>
<td rowspan="2" style="border-left: 2px solid #999; padding-left: 30px; vertical-align: middle;" valign="middle">
<span><a href="https://www.greatplacetowork.ca/en/best-workplaces/all-certified-companies#certified-organizations/view-sub-list-details/5b0842f21dd2d7498d2eeaf7/" target="_blank" rel="noopener"><img border="0" width="70" height="70" alt="Great Place To Work icon" style="border:0; height:70px; width:70px;" src="https://avanti.ca/signatures/images/gpw.png">
</td>
</tr>
<tr>
<td style="font-size: 10pt; font-family: 'Open Sans', Arial, sans-serif; padding-bottom: 0px; padding-top: 5px; padding-left: 10px; vertical-align: bottom;" valign="bottom">
<span><a href="https://www.facebook.com/AvantiSoftware/" target="_blank" rel="noopener"><img border="0" width="19" alt="facebook icon" style="border:0; height:19px; width:19px;" src="https://avanti.ca/signatures/images/fb.png"></a>amp;nbsp;</span><span><a href="https://twitter.com/AvantiHCM" target="_blank" rel="noopener"><img border="0" width="19" alt="twitter icon" style="border:0; height:19px; width:19px;" src="https://avanti.ca/signatures/images/tw.png"></a>amp;nbsp;</span><span><a href="https://www.glassdoor.ca/Overview/Working-at-Avanti-Software-EI_IE384910.11,26.htm" target="_blank" rel="noopener"><img border="0" width="19" alt="glassdoor icon" style="border:0; height:19px; width:19px;" src="https://avanti.ca/signatures/images/gd.png"></a>amp;nbsp;</span><span><a href="https://www.linkedin.com/company/avantisoftware" target="_blank" rel="noopener"><img border="0" width="19" alt="linkedin icon" style="border:0; height:19px; width:19px;" src="https://avanti.ca/signatures/images/li.png"></a>amp;nbsp;</span><span><a href="https://www.instagram.com/avantisoftware/" target="_blank" rel="noopener"><img border="0" width="19" alt="instagram icon" style="border:0; height:19px; width:19px;" src="https://avanti.ca/signatures/images/ig.png"></a>amp;nbsp;</span>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</BODY>
</HTML>
Есть ли какой-либо способ уменьшить масштаб всего HTML в приложении Gmail для iOS?
Спасибо!
Комментарии:
1. Пожалуйста, поделитесь своим кодом
2. Просто поделился, спасибо!