网页的缩放取决于设备尺寸

Question

我正在为平板电脑开发应用程序，其中固定的容器宽度为500px，高度为800px。由于某些限制，我无法保持容器大小的百分比。

由于这个原因页面不能缩放到设备宽度（横向或纵向）。

我需要将整个容器缩放到设备尺寸。

有没有解决方案。

在此先感谢。

Answer 1

@media (min-width: 500px) and (min-height: 800px) { 
    .bloc { 
     width : 500px; 
     height : 800px; 
    } 
} 

@media (min-width: 1024px) and (min-height: 768px) { 
     .bloc { 
      width : 1024px; 
      height : 768px; 
     } 
    } 

您可以使用媒体查询来了解设备的大小，并在css中设置宽度和高度。您可以找到有关媒体查询更多ifnormations Mozilla的论坛：https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries

Answer 2

你可以尝试在DIV包装您的元素，并尝试添加

max-width: 500px; 
width: 100%; 

它，因此它会动态扩展到500px的一个最大宽度。您可以尝试@media queries为视口尺寸定义特定的CSS。