Question

我想知道是否有办法用CSS在网站中设置max-width图像而不知道图像的宽度是多少？

现在，我目前在我的CSS中有这个设置：

img {width: 100%; height: auto; display: block;}

将设置所有图像以填充浏览器的整个宽度，并在浏览器调整大小时进行缩放。

我唯一想知道的是，如果用户将图像上传到CMS（在这种情况下为Wordpress），我如何获得该图像的宽度以便它可以设置图像的max-width，使其不会一直伸展，而不必在CSS中设置通用值？有什么方法可以使用CSS，还是我必须使用javascript路径？

我的理由是，我不确定用户可能在其网站上添加/更新的某些图片的尺寸。

在过去，我总是在特定类中声明max-width值（示例）：

.post img {max-width: 300px;}

这很好，因为我知道手前的图像宽度。但正如我之前提到的，我不确定某些图片在上传并添加到网站上时的宽度是多少。

Answer 1

显然，当您预览每张图片时，您需要最大宽度值。

如果将此图像放在放置在哪里的表中怎么样？你想要并拥有你想要的max-width（根据你的屏幕宽度）并将image width设为table width的100％。例如

<table style="width:50%">
  <tr>
    <td>
      <img src="your.img.url" style="width:100%"/>
    </td>
  </tr>
</table>

当然，每次调整浏览器大小时图像都会被拉伸或者即使原始图像宽度小于表格宽度