在电子邮件响应媒体查询不工作

问题描述 投票:0回答:1

我对一个负责任的电子邮件简单的代码无法正常工作。当我预览它在我的Android或在Dreamweaver它仍然是600个像素,我正在滚动条。我不是想在Gmail或Yahoo进行查看。我在做什么错误或缺什么?

<!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=UTF-8" />
<title>Untitled Document</title>
<style type="text/css" data-premailer="ignore">

@media screen and (max-width:550px) {

table[class="wrapper"] {
    width: 100% !important;
}

td[id="content"] {
    width: 100% !important;
}


img[class="tulips”] {
width:100% !important; 
height: auto !important;
}
}
</style>
</head>

<body>
<table width="600" border="0" class="wrapper">
<tr>
<td>


<table width="100%" border="0">
  <tr>
    <td id="content">hello</td>
  </tr>
</table>

 <table width="100%" border="0">
  <tr>
    <td id="content"><img src="https://lh3.googleusercontent.com/-EfoZBXkd-H0/VIcj6laLtaI/AAAAAAAAAhM/z67q37qNBho/w600-h438-no/images-12-9-14.jpg" alt="Tulips" width="600 px" style="display: block; padding: 0" class="tulips"></td>
  </tr>
</table>


</td>
  </tr>
</table>
</body>
</html>
css email media
1个回答
0
投票

看看你的CSS为你的img标签。引号郁金香后一种错误的。它改成这样:

img[class="tulips"] {
  width:100% !important; 
  height: auto !important;
}
© www.soinside.com 2019 - 2024. All rights reserved.