搜尋

首頁  >  問答  >  主體

在HTML郵件中,Gmail的背景顏色無法正常運作

<p>2023年8月 - 有人有一個在Gmail中可以正常工作的創建帶有整個郵件正文背景顏色的簡單示例嗎?我已經到處尋找,截至2023年8月,沒有一個程式碼範例在Gmail中有效。希望有人能分享一個從<body>到</body>的小片段,截至2023年8月在Gmail中有效。我將永遠感激不盡。 </p> <p>我嘗試了無數的選項,但絕對沒有一個有效。 </p>
P粉344355715P粉344355715466 天前425

全部回覆(1)我來回復

  • P粉155128211

    P粉1551282112023-08-17 13:04:09

    希望這對你有幫助:

    <!-- width: calc((480px - 100%) * 480); -->
    <table cellpadding="0" cellspacing="0" style="margin:auto; max-width:600px; width: 100%; font-size: 0; border-collapse: collapse;">
        <tr>
            <td>
                <h1 style="margin: 0; padding: 0; font-size: 30px; text-align:center; background: #e1c18b; color: #643c33; line-height: 2;">与我自拍</h1>
            </td>
        </tr>
        <tr>
            <td>
                <img src="https://image.freepik.com/free-photo/camera-mirror_446-19322773.jpg" style="max-width: 100%; display: inline-block; vertical-align:top;" alt="Hero Image" />
            </td>
        </tr>
        <tr>
            <td style="background: #322421;">
                <table cellpadding="10" cellspacing="0" style="width: calc((480px - 100%) * 480); min-width: 50%; max-width: 100%;  font-family: arial; font-size: 14px; display: inline-block;">
                    <tr>
                        <td>
                            <img src="https://image.freepik.com/free-photo/young-hipster-woman-making-photos-with-vintage-film-camera-at-summer-field-women-lifestyle-concept_1150-1054.jpg" alt="" style="width: 100%; display: inline-block; vertical-align: top;" />
                            <p style="padding: 10px 0; margin: 0; text-align: justify; color: #f6e2c0;">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nostrum praesentium ipsa vero consequuntur sunt porro vitae, a sed fuga debitis ratione, quas mollitia voluptate, ad voluptatum repellat voluptates! At, doloribus.</p>
                        </td>
                    </tr>
                </table>
                <table cellpadding="10" cellspacing="0" style="width: calc((480px - 100%) * 480); min-width: 50%; max-width: 100%;  font-family: arial; font-size: 14px; display: inline-block;">
                    <tr>
                        <td>
                            <img src="https://image.freepik.com/free-photo/young-hipster-woman-making-photos-with-vintage-film-camera-at-summer-field-women-lifestyle-concept_1150-1054.jpg" alt="" style="width: 100%; display: inline-block; vertical-align: top;">
                            <p style="padding: 10px 0; margin: 0; text-align: justify; color: #f6e2c0;">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nostrum praesentium ipsa vero consequuntur sunt porro vitae, a sed fuga debitis ratione, quas mollitia voluptate, ad voluptatum repellat voluptates! At, doloribus.</p>
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
        <tr>
            <td style="margin: 0; padding: 10px; font-size: 20px; text-align:center; background: #564037; color: #ffffff;">
                成为自拍专家
            </td>
        </tr>
    </table>

    回覆
    0
  • 取消回覆