移动端兼容
文章平均质量分 69
移动端兼容
扶苏1002
一个热衷于技术的前端博主
展开
-
图文并茂带你弄懂物理分辨率、分辨率、物理像素、逻辑像素、dpr、ppi
物理像素(physical pixel)又可以称为设备像素像素和分辨率有关系,如分辨率为 1920x1080 ,宽就有1920个物理像素 高就有1080个物理像素我们来感受一下这些物理像素点,像一个个小格子,一个个小点,看得很清楚再细看每个小点,每一个小像素点都是由三原色RGB组成,显示器再控制明暗程度就可以显示想要的效果图案,从定义上来看,像素是指三原色及其灰度的基本编码。实际的开发是以物理像素为准的吗?这两个手机的宽和高都是一样的,很显然高清屏分辨率4 * 8比标清屏的2 * 4要清晰一些。原创 2024-04-08 16:32:36 · 1010 阅读 · 0 评论 -
移动端软键盘问题
在 IOS 上,输入框(input、textarea 或 富文本)获取焦点,键盘弹起,页面(webview)并没有被压缩,或者说高度(height)没有改变,只是页面(webview)整体往上滚了,且最大滚动高度(scrollTop)为软键盘高度。同样,在 Android 上,输入框获取焦点,键盘弹起,但是页面(webview)高度会发生改变,一般来说,高度为可视区高度(原高度减去软键盘高度),除了因为页面内容被撑开可以产生滚动,webview本身不能滚动。原创 2024-04-08 14:06:52 · 914 阅读 · 0 评论 -
Vue移动端适配方案--插件版
postcss-pxtorem:将px转换为remamfe-flexible:为html、body添加font-size,窗口调整时候重新设置font-sizeautoprefixer 为css添加兼容性前缀。原创 2024-02-06 15:21:45 · 307 阅读 · 0 评论 -
移动端vw适配方案
如果设计稿给我们一个盒子宽是 350px 高是 400px,那么我们只要在数值的基础上缩小 100倍即可,宽是 3.5rem高是 4rem。不管在什么屏幕下,我们的屏幕宽都是。的根元素设置字体大小值就为。原创 2024-02-06 15:11:02 · 213 阅读 · 0 评论 -
移动端rem适配方案
当我们做的移动端适配以后,这个网页仍然有可能在。元素设置最大宽度和居中,来适配pc端。,那么我们只要在数值的基础上缩小。的适配(不同机型不同设备宽度)的根元素设置字体大小值就为。如果设计稿给我们一个盒子。打开,这时候我们就需要对。原创 2024-02-06 15:05:16 · 343 阅读 · 0 评论