如何在所有设备上获得相同大小的图片和项目？

Question

我想在两台设备上拥有相同尺寸和比例的图像和项目。但他们是不同的。特别是在Android上，规模真的很奇怪。我尝试了几件事px和％。但那没用。目前它的％。当我在iPhone X上运行应用程序时，它又一次不同。所以你知道如何在所有设备上拥有相同的尺寸和比例。

这是CSS代码

.hey{
   position: absolute; left: 76%; top: 21%;
}

#avatar{
  height: 25%; 
  width: 35%; 
 border: 2px solid #fff;
 border-radius: 50%;
 box-shadow: 0 0 5px gray;

 position: absolute; left:35%; bottom: 70%;
}

Left(IOS) Right(Android)

Answer 1

尝试使用max-width和max-height属性来修复图像

#avatar{
  height: 25% !important; 
  width: 35% !important;
  max-width : 250px !important;
  max-height : 350px !important; 
  border: 2px solid #fff;
  border-radius: 50%;
  box-shadow: 0 0 5px gray;

  position: absolute; left:35%; bottom: 70%;

}