我怎样才能保持 Mozilla Firefox 上的图像比例?

How could I keep the ratio of images on Mozilla Firefox?

我使用此代码检索并保持图像的比例:

<img class="r r-2x img-full " style="background:url('<?php echo $image; ?>') no-repeat top center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover;  background-size: cover;"/>

此解决方案适用于 IE,Chrome不适用于不显示图像的 Mozilla Firefox。那么我该如何进行呢?我尝试使用 src="<?php echo $image; ?>",但不遵守比例

使用 imgdiv 应该无关紧要。 我看到的唯一问题是我必须在元素上应用宽度和高度才能查看图像。虽然图像保持正确的纵横比。

加上img标签:

<img class="r-r-2x-img-full" border="0" style="display:block; width: 100px; height: auto; background:url('<?php echo $image; ?>') no-repeat top center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover;  background-size: cover;" />

加上div标签:

<div class="r-r-2x-img-full" border="0" style="display:block; width: 100px; height: auto; background:url('<?php echo $image; ?>') no-repeat top center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover;  background-size: cover;" />

希望这对您有所帮助:)