完美的模板图像在通过使用file\u get\u内容的php邮件脚本发送时被置乱

我有一个简单的问题：我发送了以下没有瑕疵的模板，图像通过电子邮件显示ok，使用一个非常简单的表单，使用php和函数文件_get_contents../template/index.html；从文件加载html模板

php：

<?php 

$para = $_POST['email'];
$de = 'guilherme@cais.digital';
$nomede = 'Cais Digital';

$assunto = 'Bem Vindo a Cais Digital';
$mensagem = file_get_contents("../template/index.html");
if (PATH_SEPARATOR ==":") {
    $quebra = "\r\n";
} else {
    $quebra = "\n";
}
$headers = "MIME-Version: 1.1".$quebra;
$headers .= "Content-type: text/html; charset=UTF-8".$quebra;
$headers .= 'From: '.$nomede.'<'.$de.'>'.$quebra; //E-mail do remetente
$headers .= "Return-Path: $para".$quebra; //E-mail do remetente
if(mail($para, $assunto, $mensagem, $headers, "-r". "guilherme@cais.digital")){
    echo ("<SCRIPT LANGUAGE='JavaScript'>
window.alert('Mensagem enviada com sucesso. Aguarde nosso contato ;)')
window.location.href='https://cais.digital';
</SCRIPT>");
}else{
    echo ("<SCRIPT LANGUAGE='JavaScript'>
    window.alert('Erro no envio da mensagem. Por favor, tente novamente.')
    window.location.href='https://cais.digital';
    </SCRIPT>");
}?>

模板是完美的，但当我把它发送到一封电子邮件时，我尝试使用我的gmail，它收到的时候图像被打乱了

如果你们可以的话，试着把这个模板发送到你们的电子邮件中，在第一个表单中输入

有什么解决办法吗