Web—11-手机端页面适配

<div class="markdown-here-wrapper" data-md-url="https://i.cnblogs.com/EditPosts.aspx?opt=1"&gt;
<h5 id="-" style="margin: 1.3em 0px 1em; padding: 0px; font-weight: bold; font-size: 1em">流式布局：
<p style="margin: 0px 0px 1.2em !important">就是百分比布局，非固定像素，内容向两侧填充，理解成流动的布局，成为流式布局

<h5 id="-" style="margin: 1.3em 0px 1em; padding: 0px; font-weight: bold; font-size: 1em">视觉窗口：
<p style="margin: 0px 0px 1.2em !important">viewport是移动端持有。这是一个虚拟的区域，承载网页的。

<p style="margin: 0px 0px 1.2em !important">承载关系:浏览器—-》viewport—-》网页

<h5 id="-" style="margin: 1.3em 0px 1em; padding: 0px; font-weight: bold; font-size: 1em">适配要求：

满足这些要求达到了适配，国际上通用的适配方案，标准的移动端适配方案。

<h5 id="-" style="margin: 1.3em 0px 1em; padding: 0px; font-weight: bold; font-size: 1em">适配设置：

设置视口的标签，在head里面并且应该紧接着编码设置。
viewport的功能：
    1，width：可以设置宽度（device-width：当前设备的宽度）
    2，height：可以设置高度
    3，initial-scale：可以设置默认的缩放比例
    4，user-scalable：可以设置是否允许用户自行缩放
    5，maximum-scale：可以设置最大缩放比例
    6，minimum-scale：可以设置最小缩放比例
    在 content=''使用以上参数
    1. width=device-width   宽度一致比例是1.0
    2. initial-scale=1.0    宽度一致比例是1.0
    3. user-scalable=no     不允许用户自行缩放  （yes，no  1,0）
    标准适配方案：
            

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [e-mail] 举报，一经查实，本站将立刻删除。