html - 根据屏幕分辨率调整图像大小的简单方法

标签 html css image sizing

我已搜索此要求的解决方案,但尚未找到。

我想在多个移动设备(例如 iPhone 4/5、iPad 3/4 和 Android 设备)的 HTML 页面中显示 230(宽度)x 390(高度)的图像。

目前图片在 iPhone4 上显得太大而在 iPad3 上显得太小。

如何根据屏幕尺寸显示这些图像?

如果这意味着图像在更大的屏幕上会被拉伸(stretch)并且不那么清晰,那也没关系。

最佳答案

使用 background-size:contain,您的 div 的背景图像将拉伸(stretch)以填充容器。

background-size: contain;

关于html - 根据屏幕分辨率调整图像大小的简单方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24436542/

相关文章:

javascript - 如何使用 Express 通过 HTTP 发送图像

javascript - 使用 href ="#About us"在一个网站上导航不适用于较小的设备

html - 使用 !important 覆盖 CSS 文件内联 CSS 不起作用

javascript - 用 fetch 事件替换 service worker 中的 Assets

asp.net - 在屏幕键盘上调出大写的文本输入

CSS 选择器,但不是在存在另一个类时

c# - c# 加载什么图像格式最快?

php - 在图像下方添加文本,输出取决于输入语言?

html - 带有垂直 slider 的 jquery mobile

html - 根据内容展开div