我有一种情况是仅使用HTML和CSS将原始分辨率调整为指定尺寸的图像。有没有办法做到这一点。
我尝试使用以下代码：
代码：
<div style="background-image: url(img.jpg); background-position: center; background-size: 50px; background-repeat:no-repeat; width:100px; height:100px;">
这是正确的方法吗？还是有其他选择。
答案 0 :(得分：0)
如果您将图片放大，则必须使用 填充额外的空间。
您可以拉伸图像以填充较大的尺寸，这些尺寸必须通过几种算法中的任意一种推断原始像素中的新像素。当你这样做时，你不能获得“原始清晰度”，尽管根据你的情况和你认为可以接受的东西，你可以“足够好”。
为了保持相同的清晰度/分辨率，您必须用其他东西填充额外的空间，而不是拉伸图像 - 一种可能性是平铺图像以填充空间，但当然它不是相同的图像。对于背景图像，当图像设计为平铺时，通常可以接受平铺。
你无法从无所作为。
答案 1 :(得分：0)
您无法动态调整图像大小并获得相同的分辨率，分辨率将相同（相同尺寸），更大（尺寸小于原始尺寸）或更小（尺寸大于原始尺寸）。您需要使用PHP之类的方法处理图像以保持相同的分辨率。
如果您正在谈论宽高比，您可以仅使用HTML / CSS进行操作，但是您需要某种服务器端处理器来根据您的最终输出大小确定正确的宽度/高度对。但是，如果这样做，您的分辨率将如上所述改变，您将需要至少两个DIV才能正确更改图像大小：
<div class="div_wrapper" style="overflow:hidden"><div class="image_wrapper" style="top:xxx;left:xxx;"><img src="..." style="width:xxx;height:xxx;"></div></div>
显然你需要确保高度/宽度不比div_wrapper短，否则背景会显示。