标签:类型 图片设计 tail cheng ati 比较 type blank 设计图
现在移动端颗粒度越来越小,所以清晰度很高,如华为p9的devicePixelRatio为4,
这是有多变态,devicePixelRatio是物理像素/逻辑像素=倍率devicePixelRatio,所以
如倍率为4,一个像素在设备上放大了4倍,所以真实4像素是很难在设备上展示出现的,
只能使用缩放等手段去实现,这就像为什么1px边框很难在设备实现一样,现在设备都是
倍率为2,所以经常在网上看到缩小0.5的css方式,这也是为什么经常可以看到一些UI设计图
会有@3x\@2x等图片设计,因为兼容3、2倍率的设备,手机上图片是最容易被发现模糊化的。
target- densitydpi 已被抛弃,所以不要使用了。
之前一遍介绍过vw,可以使用它,那么就可以不那么费力开发了:gulp自动编译为css的vw单位
资料:
CSS像素、物理像素、逻辑像素、设备像素比、PPI、Viewport
移动端软键盘keyCode获取只有keyup与keydown才能获取,其他都不行,或者有兼容问题。
还有一般输入太快或一次输入太多到文本框、还有输入中文等就会出现229,所以这也是问题,
所以我觉得没必要就不要使用,因为它不想PC端那么精确使用。
还有软键盘的出现会改变高度,所以可以直接获取文档高度确认或resize事件。
还有多个input会在一起不会不断触发伸缩软键盘,只会只有第一个触发后其他再切换触发不会触发的。
所以六个格子是可以直接6个input实现。
type类型再移动端是作用比较大。
比如type=number直接就是数字九宫格,不能输入出了+-.数子之外的字符,
type=tel,就和手机电话的一样,就只能输入手机的电话的格式内容东西。
比如数字*#等
移动端界面devicePixelRatio问题与移动端软键盘keyCode
标签:类型 图片设计 tail cheng ati 比较 type blank 设计图
原文地址:https://www.cnblogs.com/zhangzhicheng/p/8987902.html