wordpress CMS主题 微信
Home > 网站建设 > Adaptive theme how ban Webpage narrowed, but can be enlarged

Adaptive theme how ban Webpage narrowed, but can be enlarged

高时银博客 网站建设 点击: 2,222 次 0 0
  • 标签:
  • Recently a little effort to high silver blog into a compatible mobile device such asmobile phone website, response type website. This is because in the group with some friends group chat, group of friends asked me why I don't put your own website also built a mobile phone website? And now many users through themobile phone to find demand information, this is a very large user groups. Canbe prompted by a sudden impulse, the high silver blog and US made compatibleresponse type mobile phone website, can display properly in different terminals.

    In this section, mainly elaborate on a very important details which should be paid attention to in the production of response type theme -- response how the subject ban Webpage narrowed, but can be enlarged.

    I set the mobile phone mode, browse my Webpage with mobile phone browser,found my Webpage may be reduced to not see what the word word, and I watched the other mobile phone website (such as beauty network), which can not be reduced, only amplification. The discovery of this issue, I began to search for relevant information immediately, finally found the problem in that part of the code added to the header file.

    My original code is:

    <meta name="viewport" content="width=device-width" /> <!-- 手机浏览时用 -->

    This code is just let Webpage wide adaptation to physical mirror the width of themobile phone. But it did not set a minimum width, and the ratio of page zoom,thus causing the occurrence of what I said above situation.

    The study, just put this code into it on the line:

    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=4, minimum-scale=1, user-scalable=yes" /> <!-- 手机浏览时用 -->

    To explain this code means:

    Width=device-width: Webpage width equal to the width of the screen;

    Initial-scale=1: the minimum area Webpage shows a screen ratio, namely with the screen width;

    Maximum-scale=4: Webpage can be enlarged to 4 times the screen width;

    Minimum-scale=1: 1 times Webpage can reduce to the screen, which is notreduced Webpage, namely the original size.

    User-scalable=yes: Webpage users can begin to adjust the size, if the yes into no, said not to adjust the size.

    This is a very important step, if the lack of this step, all efforts will be in vain. So,want to own theme into response theme of friends, we must pay attention to,otherwise, wrong, while also feel at a loss.

    版权所有 © 转载时必须以链接形式注明作者和原始出处!