I am using phpmailer for sending email it contains many images including background images it is working fine with gmail and yahoo but in outlook it is not showing images as my study the outlook does not support background images option so there is any alternative for that but outlook is not showing images also.
$mail->Body = '
<div style="background: url(http://88.194.145.207:8882/p3-fi/bgimage.jpg); background-repeat: no-repeat; background-position: center; background-size: cover; background-color:blue;">
<div style="height:70px;">
</div>
<div style="background-image: url(http://88.194.145.207:8882/p3-fi/bgimage.jpg); background-repeat: no-repeat; background-position: center; background-size: cover;"></div>
<table align="center">
<tr>
<td><img src="http://88.194.145.207:8882/p3-fi/logo.png" /></td>
</tr>
</table>
<div style="height:30px; "></div>
<div style="width:50%; height:200px; display:flex; margin:auto; background-color:gray; background-image: url(http://88.194.145.207:8882/p3-fi/image2.jpg); background-repeat: no-repeat; background-position: center; background-size: cover;">
<table align="center">
<tr>
<td><img src="http://88.194.145.207:8882/p3-fi/download.png" style="border-radius:100px; margin-top:30px;" /></td>
</tr>
</table>
</div>
<div style="width:50%; height:50px; margin:auto; background-color:gray; background-image: url(http://88.194.145.207:8882/p3-fi/image2.jpg); background-repeat: no-repeat; background-position: center; background-size: cover;">
<h3 style="color:white; text-align:center; margin:0px;"><a href="http://88.194.145.207:8882/p3-fi/'.$link.'" style="color:white; text-decoration:none;">DOWNLOAD FILE<a/></h3>
</div>
<div style="width:50%; margin:auto; background-color:white;">
<h3 style="margin:0px; padding-left:30px; padding-right:30px; padding-top:30px; Text-align:center;">'.$link2.'<br>Ready To download</h3>
<p style="padding:20px; text-align:center; margin:0px;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. In congue arcu a posuere mattis. Integer mollis eleifend lorem id sodales. Duis sollicitudin diam enim,</p>
</div>
<div style="width:50%; margin:auto; position:relative; text-align:center; background-color:white; height:100px; ">
<a href="http://88.194.145.207:8882/p3-fi/'.$link.'"><button style="background-color:#2C15D9; margin-top:25px; color:white; border-color:blue; border-radius:100px; width:150px; height:30px;"><b>GET NOW</b></button></a>
</div>
<div style="width:50%; margin:auto; background-color:white; display:flex;">
<table align="center" style="">
<tr style="margin:0px;">
<td style="padding:10px;"><img src="http://88.194.145.207:8882/p3-fi/facebook.png" style="width:20px; height:20px;"/></td>
<td style="padding:10px;"><img src="http://88.194.145.207:8882/p3-fi/twitter.png" style="width:20px; height:20px;"/></td>
<td style="padding:10px;"><img src="http://88.194.145.207:8882/p3-fi/instagram.png" style="width:20px; height:20px;"/></td>
<td style="padding:10px;"><img src="http://88.194.145.207:8882/p3-fi/youtube.png" style="width:20px; height:20px;"/></td>
<td style="padding:10px;"><img src="http://88.194.145.207:8882/p3-fi/google.png" style="width:20px; height:20px;"/></td>
</tr>
</table>
</div>
<div style="width:50%; margin:auto; background-color:white; height:50px;"> </div>
<div style="height:30px;"></div>
<p style="text-align:center; color:white;">@2018 P3 by CloudAssest <a href="#" style="color:white;"><u>Unsubscribe</u></a><p>
</div>
';
This is a well-known problem: Outlook does not support the CSS background-image property. I don't know of any workaround other than to design defensively so that the loss of the background image does not impact your design too badly; for example, if you have light text on a dark background image, also set the background colour to something dark so that you're not left with light text on a white background.