在我的应用程序中，每个项目列表都有一个与之关联的方形108x108px图像。我试图响应地显示图像，但如果数据库中没有图像URL，我想显示一个与图像具有相同尺寸的备用灰色方块。
默认情况下，当用户加载页面时，将显示灰色方块，但是当用户通过jQuery将数据加载到src=""的{{1}}属性时，它应该完全覆盖灰色方块。我一直试图在<img>标记上使用CSS background: #ddd取得一些成功，但我无法使用与加载时图像相同的尺寸来显示背景。鉴于我知道确切的尺寸，这似乎很容易，直到你达到较小的屏幕宽度，图像（或背景）需要缩小以适应包含<img>而不会被裁剪。
基本上，我有一个基于百分比宽度的容器div。当该宽度变为＆lt; 108px时，<div>应该有<img>和width:100%，并且灰色背景应该匹配相同的尺寸。