淘客们博客
淘客们博客是专注于互联网研究的自媒体博客,爱分享,交流,交朋友。我是潘仔。
文章22921 浏览32207288

怎么让PC端网站在手机打开自适应

    很多网站之前只制作了唯一的PC端网站,没有做自适应手机网站,这样用户访问网站时,就会显示PC端版面,导致在手机端只能显示出网站的一部分。如下图:
 
 
 
    如何解决PC网站在手机端显示不全的问题呢?下面学做网站论坛为广大学习网站制作课程的学员提供二种方法:
 
    方法一:制作与PC网站同步的手机端网站。
 
    制作一个与PC网站同步的手机网站,通过代码判断用户的浏览设备是手机还是电脑,并显示相应的网站版面。
 
    制作手机端网站常用的方法是使用Bootstrap自适应前端框架。详细制作方法见:自适应手机网站制作课程
 
    如:学做网站论坛就是制作了一个与PC网站内容完全同步的手机网站版面,可以自动识别浏览者的浏览设备。
 
    方法二:使用META属性控制PC网站版面在手机端全屏显示。
 
    如果不想制作手机端网站,可以通过meta属性来控制PC端网站全屏显示。使用meta name="viewport" 属性来强制PC端网站在手机端显示的尺寸。
 
    方法很简单,只需要将下面的代码放到自己PC网站代码的</head>标签上方即可。
 
    <meta name="viewport" content="initial-scale=0.3, maximum-scale=0.5, minimum-scale=0.3, user-scalable=yes">
 
    让我们自己放了这段代码后,PC网站用手机打开时的样子,PC网站在手机端显示正常了。


免责声明:
本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如有侵犯您的版权/违法违规的内容,一经查实,本站将立刻删除。