0
電子メールテンプレートを修正しようとしていますが、ロゴを中央に置くことはできません。それが書かれた方法は私を混乱させ、私はそれに変更を加え続け、私はそれを正しく得ることはできません。あなたが私を助けることができれば、それは非常に高く評価されるでしょう。ここでは、次のようになります。ここでは電子メールテンプレートのCSS/HTMLを修正しました
は私が修正しようとしているコードは次のとおりです。
<style type="text/css">
@media only screen and (max-width: 480px) {
table {
display: block !important;
width: 100% !important;
}
td {
width: 480px !important;
}
}
</style>
<table width="100%" bgcolor="#09afdf" border="0" cellspacing="0" cellpadding="0" id="background" style="height: 100% !important; margin: 0; padding: 0; width: 100% !important;">
<tr>
<td align="center" valign="top">
<table width="600" border="0" bgcolor="#09afdf" cellspacing="0" cellpadding="20" id="preheader">
<tr>
<td valign="top">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td valign="top" width="600">
<div class="preheader_links">
<p style="color: #666666; font-size: 10px; line-height: 22px; text-align: right;">Unable to view this message? <a href="javascript:void(0)" :hover="text-decoration: underline;" onclick="myEvent();" onmouseover="this.style.textDecoration='underline'" onmouseout="this.style.textDecoration='none'" style="color: #666666; font-weight: bold; text-decoration: none;">Click here</a></p>
</div>
</td>
</tr>
<tr>
<td valign="top" width="600">
<div class="logo">
<a href="javascript:void(0)" onclick="myEvent();" onmouseover="this.style.color='#666666'" onmouseout="this.style.color='#514F4E'" style="color: #514F4E; font-size: 18px; font-weight: bold; text-align: left; text-decoration: none;"> <img src="http://res.cloudinary.com/dya7pcwuu/image/upload/v1504207932/headerlogo_1_auznv6.png"></a>
</div>
</td>
</tr>
</table>
</td>
</tr>
</table>
<!-- // END #preheader -->
<table width="600" border="0" bgcolor="#FFFFFF" cellspacing="0" cellpadding="0" id="header_container">
<tr>
<td align="center" valign="top">
<table width="100%" border="0" bgcolor="#FF0412" cellspacing="0" cellpadding="0" id="header">
<tr>
<td valign="top" class="header_content">
<h1 style="color: #FFFEF7; font-size: 24px; text-align: center;">Submission</h1>
</td>
</tr>
</table>
<!-- // END #header -->
</td>
</tr>
</table>
<!-- // END #header_container -->
<table width="600" border="0" bgcolor="#fcfcfc" cellspacing="0" cellpadding="20" id="body_container">
<tr>
<td align="center" valign="top" class="body_content">
<table width="100%" border="0" cellspacing="0" cellpadding="20">
<tr>
<td valign="top">
<h2 style="color: #0f060f; font-size: 22px; text-align: center;"><%[email protected]%></h2>
<p style="color: #0f060f; font-size: 14px; line-height: 22px; text-align: center;">Name: <%[email protected]%></p>
<p style="color: #0f060f; font-size: 14px; line-height: 22px; text-align: center;">Email: <%[email protected]%></p>
<p style="color: #0f060f; font-size: 14px; line-height: 22px; text-align: center;">Phone: <%[email protected]%></p>
<p style="color: #0f060f; font-size: 14px; line-height: 22px; text-align: center;">Message: <%[email protected]%></p>
</td>
</tr>
</table>
</td>
</tr>
</table>
<!-- // END #body_container -->
</td>
</tr>
</table>
<!-- // END #background -->UPDATE
私がしようとしています提案とそれはまだ画像のように出てくる低い。私もサーバーを再起動し、それはまだありません。私のコードスニペットを見ると、それは側面として表示されていますが、実際に電子メールにどのように表示されているのかをイメージすれば分かります。すべての提案は、出力は以下の画像と同じです。
それが原因で私が把握することはできません、私が使用しています電子メールクライアントで何かの下に画像としてレンダリングされて表示されます2 UPDATE。
'style'と' @のmedia'？私が知っている限り、すべてがインラインでなければなりません。また、あなたが望むならhttp://foundation.zurb.com/電子メールのフレームワーク – Sergey
これは電子メールのためのブートストラップテンプレートにありましたので、わかりません。 –