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

Posted 2021-04-12

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

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

答案

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

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

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

编辑从img标签中删除宽度和高度。因为现在它们是：

<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">