html - 在html电子邮件中调整图像大小以适应单元格

我有一个响应HTML电子邮件设计，我使用了广告系列监控器中的this教程进行了设计，但是在设计了许多模板并在电子邮件设计博客上阅读了很多内容后，在移动设备上查看图片时，我遇到了一个问题，该图片不适合该设备我了解到gmail默认情况下会删除头部的css或样式，并且仅允许内嵌html。因此，在我的情况下，我希望我的图片适合设备的宽度，但在发送邮件时不适合设备的宽度，但是我可以在浏览器上看到由于以下编码媒体查询。

 @media screen and (max-width: 480px) and (min-width:300px) {
.col185{max-width:100% !important;}
.col180{max-width: 100% !important;}
.col180 img{
  height: 155px;
 }
}

。那么，有什么办法可以让我看到在移动设备上伸展的图像。 This是我的js小提琴链接。

最佳答案

假设包含图片的div的名称为pic您应该执行此操作

的CSS

.pic img{
width:100%;
height:100%;
}

这将允许图像根据父div调整自身大小。如果您仍然不了解此方法，请告诉我，我将继续进行介绍