背景
通常情况下，我们制作的界面要做为子网页，或者内嵌网页给到前端同学使用。
有时前端同学的界面分辨率做的比较低，我们必须制作符合他要求的分辨率。
而Unity制作的webgl，打包后设置的分辨率会影响画面精度。这就引发了一个问题，若我们按前端的分辨率制作，会导致我们画面精度很低，如果是大屏类项目，则更会模糊不清。
所以我想到一个好办法，那就是把Unity做好的html网页分辨率乘n倍，然后给Unity网页加个壳（用一个html将Unity网页嵌入进去），把整体的外壳网页缩小n倍。
解决方案
以需要给前端1920 * 1080分辨率举例，我们将unity网页设置为3840 * 2160分辨率。
然后在同级目录下，创建新网页index0.html，将Unity网页嵌入，并且在css将整体缩小0.5倍。代码如下：
<head>
<style type="text/css">
iframe {
transform: scale(0.5);
transform-origin: 0
}
</style>
</head>
<body>
<div id="mypage">
<iframe align="center" width="3840" height="2160" src="index.html" frameborder="0" border="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>
</div>
</body>
iframe标签中，width和height设置为Unity网页分辨率，src设置为Unity网页名称，若不是同级，则带上路径。
既然都看到这了，那就点个赞再走吧~
|