我对编码还很陌生,需要帮助。
我正在创建一个响应式网站,但我被标题图片困住了。在桌面上,它看起来不错。当我转到移动设备时,我喜欢它的大小,但图像会超出容器并显示水平滚动条。我尝试了 (overflow-x: hidden;) 来完成隐藏滚动条的工作,但它最终弄乱了移动 View 中的图像。
然后我给图像容器设置了 100% 的宽度,它完全适合屏幕,没有水平条,但是图像太小了。
我想知道如何让图像保持不变但适合容器?
我附上了一张图片来进一步解释我在说什么。谢谢!
最佳答案
您可以使用 srcset html 代码。这很简单。
<img srcset="image.jpg 320w, image.jpg 480w, image.jpg 800w"
sizes="(max-width: 320px) 280px, (max-width: 480px) 440px, 800px"
src="image.jpg" alt="Image">
关于html - 制作响应式网站但图像太小?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53078752/