Question

这是我的情况：我有一个包装器div，里面有一个主div，然后是主div中的<img />，当窗口调整大小时我必须保持它的宽高比。 <img />的宽度和高度不固定，可能会从一个图像更改为另一个图像。为了保持每个图像的纵横比，我使用:after伪元素作为我的包装类，如下所示：

wrapper:after{
    padding-top: **%;
    display: block;
    content: '';
}

但由于我不知道图像的宽度和高度，我必须在页面加载时使用jQuery动态计算其宽高比，如下所示：

$("#ad_image_main").load(function(){
    var h = $(this).height();
    var hh = (h/660)*100;
    /**/
});

#ad_image_main是我的<img />代码的ID

我必须在/**/ padding-top值（hh）中插入wrapper:after - 元素才能获得我想要的宽高比。

我该怎么做？

Answer 1

如果你在网上搜索，你会找到几种方法来做到这一点（应用新的class，更新document.stylesheet），但如果你只是插入一个{{1}元素并写入，它应该做你想要的。

基本脚本：

<style>