Html 根据屏幕大小更改图像

首先也是最重要的是，我搜索了这个网站和其他网站寻找答案。只找到了与iPhone和androids相关的东西

因此，我知道如何使用

@media tags

更改屏幕分辨率来更改图像大小，而不知道如何通过更改屏幕大小来一起更改图像（从

image1.png

到

image2.png

）

我阅读了以下关于动态网页的文章，它们似乎有我想要的，但我不相信它们描述了如何更改图像：

这可以用basic

HTML/CSS

实现吗

---

我的示例：当将屏幕分辨率从

1260px

更改为

480px

时，将图像从

image1.png

更改为

image2.png

而不是图像，您可以使用

div

并使用

媒体查询更改其
背景图像
属性。或者根据媒体查询显示/隐藏（使用
display:none/block
）图像

不使用javascript就无法更改图像源。
使用图像作为背景还允许仅加载所需的图像（如果媒体查询设置正确），从而提高带宽性能PS:OP要求的是W3C准备的。查看标签。javascript不太好。我一有机会就试试你的方法