博客
关于我
视口(viewport)学习
阅读量:614 次
发布时间:2019-03-13

本文共 495 字,大约阅读时间需要 1 分钟。

viewport 是用户网页的可视区域。即设备的屏幕上能用来显示我们的网页的那一块区域。

content里面的属性必须知道

width:控制viewport的大小,可以是指定的值,或者特殊值,如device-width表示设备指定宽度。

height:和width相对应,表示高度。

initial-scale :初始化缩放比例,也是当前页面第一次load的时候缩放的比例

maximum-scale:允许用户缩放的最大比例.

minimum-scale:允许用户缩放的最小比例。

user-scalable:用户是否可以手动缩放

设备像素和CSS像素
设备像素(device pixels)是任何设备的正式分辨率,并且(通常)可以通过screen.width/height知道。
给某个元素宽度width:128px,如果显示屏宽1024px,最大化浏览器屏幕,则该元素将在显示器上填充显示八次。
然而,如果用户缩放,则该计算将会改变。比如用户缩放为200%,则宽度为128px的元素将在1024px宽显示器上显示的四次。

屏幕尺寸(Screen size)

在这里插入图片描述
Window size
在这里插入图片描述

转载地址:http://upjaz.baihongyu.com/

你可能感兴趣的文章
nativescript(angular2)——ListView组件
查看>>
NativeWindow_01
查看>>
Native方式运行Fabric(非Docker方式)
查看>>
Nature | 电子学“超构器件”, 从零基础到精通,收藏这篇就够了!
查看>>
Nature和Science同时报道,新疆出土四千年前遗骸完成DNA测序,证实并非移民而是土著...
查看>>
Nature封面:只低一毫米,时间也会变慢!叶军团队首次在毫米尺度验证广义相对论...
查看>>
Nat、端口映射、内网穿透有什么区别?
查看>>
Nat、端口映射、内网穿透有什么区别?
查看>>
nat打洞原理和实现
查看>>
NAT技术
查看>>
NAT模式/路由模式/全路由模式 (转)
查看>>
NAT模式下虚拟机centOs和主机ping不通解决方法
查看>>
NAT的两种模式SNAT和DNAT,到底有啥区别?
查看>>
NAT的全然分析及其UDP穿透的全然解决方式
查看>>
NAT类型与NAT模型详解
查看>>
NAT网络地址转换配置实战
查看>>
NAT网络地址转换配置详解
查看>>
navbar navbar-inverse 导航条设置颜色
查看>>
Navicat for MySQL 命令列 执行SQL语句 历史日志
查看>>
Navicat for MySQL 查看BLOB字段内容
查看>>