How to apply background Image in email for outlook


<table width="600" border="0" cellpadding="0" cellspacing="0" align="center" class="mobile hero-section" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; border-collapse:collapse !important">
    <tbody>
        <tr>
            <td style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; background:url('https://themes.googleusercontent.com/image?id=iOjEWmpWlNVmx91RAaWC3irZSyq8cu05pASFz84khXxbIM83x8QP6Hnw7ZIDcZFvcAGSBpGCNsBC') !important; background-image:url(https://themes.googleusercontent.com/image?id=iOjEWmpWlNVmx91RAaWC3irZSyq8cu05pASFz84khXxbIM83x8QP6Hnw7ZIDcZFvcAGSBpGCNsBC) !important; background-position:center !important; background-repeat:no-repeat !important; -webkit-background-size:cover!important; -moz-background-size:cover!important; -o-background-size:cover!important; background-size:cover!important; background-repeat:no-repeat" bgcolor="#222222" valign="top">
            <!--[if gte mso 9]>
                <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:600px;height:414px;">
                <v:fill type="tile" src="https://themes.googleusercontent.com/image?id=iOjEWmpWlNVmx91RAaWC3irZSyq8cu05pASFz84khXxbIM83x8QP6Hnw7ZIDcZFvcAGSBpGCNsBC" color="#ffffff" />
                <v:textbox inset="0,0,0,0">
            <![endif]-->
        <table width="600" align="left" border="0" cellpadding="0" cellspacing="0" style="max-width: 100%;min-width: 100%;border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;-ms-text-size-adjust: 100%;-webkit-text-size-adjust: 100%;" width="100%" class="mcnTextContentContainer">
                    <tbody>
                        <tr>
                            <td valign="top" height="89"></td>
                        </tr> 
                        <tr>
                            <td valign="top" class="mcnTextContent" style="padding-top: 0;padding-right: 18px;padding-left: 18px;mso-line-height-rule: exactly;-ms-text-size-adjust: 100%;-webkit-text-size-adjust: 100%;word-break: break-word;color: #ffffff;font-family: Helvetica;font-size: 16px;line-height: 150%;text-align: left;">
                                <div style="text-align: center;color:#ffff!important">
                               
                                    <h1 style="text-align: left; display: block; margin: 0; padding: 0; color: #ffffff; font-family: Georgia; font-size: 42px; font-style: normal; font-weight: bold; line-height: 125%; letter-spacing: normal;"><span style="color: #ffffff;">{{ widget.section_header }}</span></h1>
                                 
                                </div>
                            </td>
                        </tr>
                         <tr>
                            <td valign="top" height="89"></td>
                        </tr> 
                    </tbody>
                </table>
                <!--[if gte mso 9]>
                </v:textbox>
                </v:rect>
            <![endif]-->
    </td>
    </tr>
</tbody>
</table>

Comments

Post a Comment

Popular posts from this blog

Pagination of multiple recent post blog

<div class="blog-section">   <div class="blog-listing-wrapper cell-wrapper">     <div class="post-listing clearfix">       {% set blog_one_posts = blog_recent_posts('6126215542', 200) %} <!-- sets a variable for a the 5 most recent posts of my default COS blog -->       {% set blog_two_posts = blog_recent_posts('6126300566', 200) %}  <!-- sets a variable for a the 5 most recent posts of my blog id 47082700. You can find the blog id in the URL of the blog dashboard for a particular blog-->       {% set blog_three_posts = blog_recent_posts('6130453958', 200) %}       {% set blog_four_posts = blog_recent_posts('6131348719', 200) %}       {% set all_posts = (blog_one_posts + blog_two_posts + blog_three_posts + blog_four_posts) | sort(true, false, 'publish_date')  %} <!-- combines the two variables into a single variable and sorts them by publish date. Please note the sort filter r
Read more

Service Filter

Image
https://www.awesomescreenshot.com/video/3075020?key=60ee7802b59aa9042128db94c23ecc2f {{ module.title }} + Add Filter All Services {% for item in module.service_type %} {{ item.Title }} {% endfor %} Cancel Apply Filters {% for item in module.service_type %} {{ item.Title }} {% for item2 in item.services %} {% if item2.image_field.src %} {% set sizeAttrs = 'width="{{ item2.image_field.width }}" height="{{ item2.image_field.height }}"' %} {% if item2.image_field.size_type == 'auto' %} {% set sizeAttrs = 'style="ma
Read more

When You Want to open popup(first time load)

$(document).ready(function() {    if (localStorage.getItem("popState") != "shown") {        $('.service_modal_box').fadeIn();        localStorage.setItem("popState", "shown")    }    $(".sqs-popup-overlay-close").click(function(a) {        $(".service_modal_box").fadeOut()    }); });
Read more