vue使用rem进行窗口的放大与缩小

最新推荐文章于 2024-07-31 02:32:11 发布

#做一个清醒的人

最新推荐文章于 2024-07-31 02:32:11 发布

阅读量1k

点赞数

分类专栏： VUE 文章标签： vue.js javascript css html

本文链接：https://blog.csdn.net/rock_23/article/details/105680862

版权

VUE 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

①找到vue的主入口HTML文件然后加上：

<script>
	window.onload = function() {
		        var deviceWidth = document.documentElement.clientWidth ||document.body.clientWidth;
		        if (deviceWidth > 750) {
		          deviceWidth = 750;
		        }   
		   document.documentElement.style.fontSize = (deviceWidth / 750) * 100 + "px";
		      };
		      window.onresize = function() {
		        var deviceWidth =
		     document.documentElement.clientWidth || document.body.clientWidth;
		        if (deviceWidth > 750) {
		          deviceWidth = 750;
		        }   document.documentElement.style.fontSize = (deviceWidth / 750) * 100 + "px";
      };
</script>

这样可以在组件中的样式中使用rem来进行屏幕的缩放了