English 中文(简体)
传真电子邮件内容转录SOS
原标题:HTML email content resizing in iOS

我的垃圾邮件申请是寄送使用甲状腺素叶模板制作的每日电子邮件摘要。 电子邮件在大多数环境中正确无误。 似乎存在问题的唯一地点是本土邮件用户。 由于某种原因,其内容正在重新调整;缩小,使案文不可读。

我尝试加添一句。

style="white-space: pre-wrap"

似乎首先在工作。 然而,今天,这个问题已经回头,我因造成这一问题而丧生。 下面是一份电子邮件所看的像SOS。

我能做些什么,迫使内容与屏幕上相匹配,而不要再消化?

这里指的是我使用的模板:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Message Center Digest</title>
    <style>a {color:#007aae !important;} </style>
</head>
<body>
<table id="main" width="100%" cellpadding="0" cellspacing="0">
    <tr>
        <td bgcolor="#003575">
            <table id="header" width="90%" border="0" cellpadding="0" cellspacing="0" align="center">
                <tr>
                    <td width="35%">
                        <a href="https://www.foo.edu"><img alt="My Logo" width="100px" border="0" src="https://www.foo.edu/sites/logo_white.png" /></a></td>
                    <td width="65%">
                        <h1 style="color: #ffffff; font-family: helvetica, arial, sans-serif; font-weight: normal; font-size: 30px; margin: 0;">Message Center Digest</h1>
                        <h2 style="margin: 0; font-weight: normal; font-family: Helvetica, Arial, sans-serif; color: #ffffff; font-size: 24px;">For <span th:text="${data.day}">Some day</span>, <a href="#" style="color: #ffffff !important; text-decoration: none;"><span th:text="${data.date}">01/01/1970</span></a></h2>
                    </td>
                </tr>
            </table>
        </td>
    </tr>
    <tr>
        <td bgcolor="#EAEEF1">
            <table width="90%" id="content" bgcolor="#ffffff" align="center" border="0" cellpadding="15" cellspacing="0" style="font-family: Arial, Helvetica, sans-serif;">
                <tr>
                    <td>
                        <a name="pagetop"></a>
                        <h3 style="font-size: 18px; margin: 0 0 5px 0;">Table of Contents</h3>
                        <h4 style="margin: 0 0 10px 0; font-size: 13px;"><a href="https://www1.foo.edu/script/LogList.asp">Campus Crime and Fire Safety Logs</a></h4>
                        <div th:each="entry, stats : ${messageMap}" th:with="channelMessage=${entry.value}">
                            <h4 th:attr="id=${ header_  + channelMessage.channelId}" th:text="${entry.key}" style="margin: 0; font-size: 13px;">Category</h4>
                            <ul th:attr="id=${ titles_  + channelMessage.channelId}" id="titles"  style="list-style: none; margin: 0 0 10px 0; padding-left: 15px; font-size: 13px;">
                            <li th:attr="id=${ t_  + message.id +  _  + channelMessage.channelId}" th:each="message : ${channelMessage.messages}"><a th:text="${message.title}" th:href="${ #message_  + message.id +  _  + channelMessage.channelId}">Title 1 </a></li>
                            </ul>
                        </div>
                        <table th:each="entry, stats : ${messageMap}" th:with="channelMessage=${entry.value}" class="category" width="100%" border="0" align="center" cellpadding="10" cellspacing="0">
                            <tr>
                                <td>
                                    <h2 th:attr="id= category_ +${channelMessage.channelId}" th:text=" Category:   + ${entry.key}" style="color: #00397C; margin: 0;">Category: Unknown</h2>
                                    <table th:each="message : ${channelMessage.messages}" class="message" width="100%" align="center" cellpadding="0" cellspacing="0" border="0" style="border-bottom: solid #ccc 1px;">
                                        <tr>
                                            <td style="font-size: 13px; color: #333333; padding-left: 15px; padding-bottom: 15px; padding-top: 15px;">
                                                <a th:attr="name=${ message_  + message.id +  _  + channelMessage.channelId}" id="message1"></a>
                                                <span th:attr="id=${ title_  + message.id +  _  + channelMessage.channelId}" ><strong th:text="${message.title}">A title</strong></span><br/>
                                                    <span th:attr="id=${ from_  + message.id +  _  + channelMessage.channelId}"><strong th:inline="text">[[ From:   + ${message.creatorName} +    ]]<a th:href="@{mailto:{to}(to=${message.creatorEmail},subject= Re:  + ${message.title}) }" th:text=" < +${message.creatorEmail} +  > ">[email protected]</a></strong></span><br/><br />
                                                    <div th:switch="${message.isHtml}">
                                                        <p style="white-space: pre-wrap" th:attr="id=${ body_  + message.id +  _  + channelMessage.channelId}" th:case="true" th:utext="${message.body}">HTML text</p>
                                                        <p style="white-space: pre-wrap" th:attr="id=${ body_  + message.id +  _  + channelMessage.channelId}" th:case="*" th:text="${message.body}">Standard text</p>
                                                    </div>
                                                <p><a href="#pagetop">Top</a></p>
                                            </td>
                                        </tr>
                                    </table>

                                </td>
                            </tr>
                        </table>
                        <br />
                        <br />
                        <br />
                        <p align="center" style="font-size: 13px;"><em>Update how you receive messages by visiting the Message Center.
                            For help using the Message Center, email: <a href="mailto:[email protected]">[email protected]</a> or call 555-123-4567.</em></p>

                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>
</body>
</html>
问题回答

我在很久以前也做了类似的事情。

这正是超文本史,我不敢肯定,为什么真的,但你必须界定一切,而且出于某种原因,页数的体体会了屏幕的全部尺寸。

在两党之间增加这一阶段,这样:

<head> 
 ...somethings


<style>    body {     margin: auto;     width: 100%;   }  </style>

...somethings
</head>

安保部可以改变该页上对超文本的浏览方式,因此,我只是与一些安保部添加了风格的标签。

Look at this example.

You can edit the HTML like a normal web page, so for the next time if a bug occurs then just write the HTML as a textfile.html on your PC, and open it on the browser, then you will be able to control it like in this video.





相关问题
CSS working only in Firefox

I am trying to create a search text-field like on the Apple website. The HTML looks like this: <div class="frm-search"> <div> <input class="btn" type="image" src="http://www....

image changed but appears the same in browser

I m writing a php script to crop an image. The script overwrites the old image with the new one, but when I reload the page (which is supposed to pickup the new image) I still see the old one. ...

Firefox background image horizontal centering oddity

I am building some basic HTML code for a CMS. One of the page-related options in the CMS is "background image" and "stretch page width / height to background image width / height." so that with large ...

Separator line in ASP.NET

I d like to add a simple separator line in an aspx web form. Does anyone know how? It sounds easy enough, but still I can t manage to find how to do it.. 10x!

热门标签