既然有把电脑版网站改为自适应网站的需求,那么也会有把自适应网站改为电脑版网站的特殊需求。虽然这种需求不常见,但是也会有,因为每个企业的业务不同,某些企业可能会在某些业务场景用到。
自适应网站改为电脑版网站怎么改呢?
本文来教您实际修改操作过程:
(1)在所有模板的头部代码
<head></head>
之间,去掉以下类似代码:
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
(2)打开所有的css文件,去掉所有@media查询代码。比如类似以下@media查询代码(仅供参考):
@media ( max-width: 991px ) and ( min-width: 768px ) { .logo { height: 80px; width: auto; margin-right: -15px;} .mlogo { height: 80px; width: auto; margin-right: -15px;} } @media ( max-width: 767px ) and ( min-width: 414px ) { .logo { height: 90px; padding:10px 0; width: auto;margin: 0 auto;display: block; } .mlogo { height: 70px; width: auto; } } @media ( max-width: 413px ) { .logo { height: 50px; padding:10px 0; width: auto;margin: 0 auto;display: block; } .mlogo { height: 50px; width: auto; } }
上述这些代码的意思是指屏幕宽度在某个区间的时候,分别要执行的css样式。如果要把自适应网站改为电脑版网站,那么就需要去掉所有平板端、手机端的@media媒体查询代码。
(3)细节调整。虽然去掉了平板端、手机端的@media代码,但是也会引发一些bug,根据实际情况,处理好这些bug。
上述这些也只是一个大体的思路,把自适应网站改为电脑版网站,需要删除几百、几千,甚至几万行代码,有时候甚至可能还会删错,在修改之前一定要注意备份,在修改过程中一定要仔仔细细。
您已成功复制微信号
leishi010
打开微信添加好友?
确定