Nice looking layout without using images

From SMTX Wiki
Jump to navigation Jump to search

The layout below can be used to show emails nicely without the need to include images that are blocked by mail clients. 

<!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=us-ascii" />
    </head>
  <body style="font-family: Arial,Helvetica,sans-serif; background-color: #f3f5f6;">
        <table align="center" style="margin: 15px auto 20px; border: 1px solid #d0d0d0; border-image: none; width: 650px; background-color: #ffffff;" cellspacing="0">
            <tbody>
                <tr>
                    <td style="border-width: 1px 1px 10px; border-style: solid; border-color: #046f96 #046f96 #bddfed; text-align: center; color: #ffffff; font-weight: bold; background-color: #046f96;">
                    <br />
                    <br />
                    Header Text
                    </td>
                </tr>
                <tr>
                    <td style="padding: 20px;">
                    #REPLACE-EmailContent#
                    </td>
                </tr>
            </tbody>
        </table>
        <center>
        <div style="font-style: italic;">Footer text</div>
        </center>
        <br />
        <hr />
        <span style="color: gray; font-family: Arial; font-size: 10px;">Disclosure text<!-- </hr> --><br />
        </span>
    </body>
 </html>
Retrieved from "https://wiki.smt-x.com/index.php?title=Nice_looking_layout_without_using_images&oldid=167"