html+css+js - 如何让pc端网站在手机上可以等比缩放的整个显示

问题描述

问 题

平时注意到有些网站初衷是为pc端设计的，在移动端打开是等比缩放的效果，如下：

它的head标签内容是如下：

而有的网站同样是在pc端显示，但是手机上打开是如下的情况：

它的head标签内容是如下：

这是什么原因呢？怎样才能做到第一种情况，毕竟可以整体展示了整个网页的内容。
我看第一种情况下也不是所有的元素的宽度用的是百分比，也有很多的宽度是写死的，如下：

解决方案

页面HEAD里加上 <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">

这篇关于html+css+js - 如何让pc端网站在手机上可以等比缩放的整个显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！