Responsive design img srcset+；尺寸图片填充，响应速度快

我有一个12列布局的站点，我正在尝试正确使用srcset和size属性来匹配我的设计

我有一个侧框，它在桌面上跨越3列，但在平板电脑和手机大小上，它跨越12列（100%宽度）

我想要的是用于桌面版本的图像，也用于移动设备（最大宽度为480px），以及用于481px和781px之间的所有设备的特定平板电脑大小的图像

这是我的代码：

<img
    src="http://placehold.it/370x150/cecece"
    srcset="http://placehold.it/768x311/f67f57 768w, http://placehold.it/370x150/cecece 320w"
    sizes="(max-width: 768px) 100vw, (max-width: 480px) 100vw"
>

在我的示例中，768版本一直使用到780px，然后使用默认的src。但是我如何让它使用320版本直到480px

这个怎么样：

<img  
    sizes="(min-width: 781px) 370px, 100vm"
    srcset="http://placehold.it/768x311/f67f57 768w, 
            http://placehold.it/370x311/cecece 480w"
>

---

它应该显示最小的图像，最高480px，然后是最大780px，小的大于780px。

非常好-它可以工作，而且看起来比我的乱七八糟的图像更好，所以谢谢。：-）