html - 如何对我的网站进行编码，以便我的 100% 宽度图像根据屏幕分辨率的变化调整大小？

Question

如何编码我的网站，以便我的 100% 宽度图像根据不同的屏幕分辨率调整大小？例如 1280 x 720。

这是我主页的链接，其中包含需要根据屏幕分辨率调整大小的图像。查看第 119 到 123 行的图像代码。

Answer 1

您使用css中的img在图像上放置了 700px+ 的高度。在 css 中添加另一个类：

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

将class="full-width-img"添加到您想要 100% 宽度的图像中。

编辑从您的img标签中 删除宽度qnd高度。因为现在他们是：

<img src="images3/motoxmaxres.jpg" class="full-width-img" width="100%" height="" alt="motocross landing">

虽然它应该是

<img src="images3/motoxmaxres.jpg" class="full-width-img" alt="motocross landing">