移动端viewport讲解

    科技2022-07-11  90

    viewport

    viewport描述: 也就是可视区域。对于桌面浏览器,我们都很清楚viewport是什么,就是除去了所有工具栏、状态栏、滚动条等等之后用于 看网页的区域,这是真正有效的区域。由于移动设备屏幕宽度不同于传统web,因此我们需要改变viewport;这是真正有效的 区域。由于移动设备屏幕宽度不同于传统web,因此我们需要改变viewport

    viewport属性

    对于viewport我们可以操作的属性: width - viewport 的宽度 (范围从200 到10,000,默认为980 像素) height - viewport 的高度 (范围从223 到10,000) initial-scale - 初始的缩放比例 (范围从>0 到10) minimum-scale - 允许用户缩放到的最小比例 maximum-scale - 允许用户缩放到的最大比例 user-scalable - 用户是否可以手动缩放 (no,yes) <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0"> meta标签表示: width=device-width :表示宽度是设备屏幕的宽度 initial-scale=1.0:表示初始的缩放比例 minimum-scale=1.0:表示最小的缩放比例 maximum-scale=1.0:表示最大的缩放比例 user-scalable=no:表示用户是否可以调整缩放比例
    Processed: 0.010, SQL: 8