维基百科将Retina译为“视网膜”。"Retina"一词，原意是“视网膜”的意思，指显示屏的分辨率极高，使得肉眼无法分辨单个像素。苹果的“iPhone4”和"new iPad"以及“Macbook Pro”中已经使用了Retina(视网膜)技术。这是一种新的屏幕的显示技术。苹果表示，Retina屏幕是一种具备超高像素密度的液晶屏，它可以将960x640的分辨率压缩到一个3.5英寸的显示屏内。也就
屏幕适配是通过对尺寸单位、图片、文字、布局这四种类型资源进行合理设计以及规划，再布局时合理利用各种类型资源，让布局拥有适应能力，能在各种设备下进行保持良好的展现效果。尺寸单位适配屏幕尺寸指屏幕的对角线的长度，单位是英寸，1英寸=2.54厘米。mdpi、hdpi、xdpi、xxdpi代表不同密度的设备；dimens：尺寸文件；dpi：是屏幕像素密度，每英寸上的像素点数，单位是dpi； ldpi=1
vue-屏幕适配方案一，PC端适配开发PC端项目，通常会要求适应各种的屏幕尺寸，并且要求浏览器缩小页面等比例变化，因此就要求写出来的前端页面是能够自适应的。 利用webpack配置px2rem-loader和1、安装npm install px2rem-loader -D
npm install lib-flexible -S lib-flexible来实现px转化rem2、在项目入口文件 ma
转载
2024-06-23 13:49:53
1023阅读
我想做安卓的朋友们，很多即便是做了好几年的安卓，对屏幕的各种适配，有时候也会弄的比较头痛！即便是采用了各种是配方法，但是有时候，感觉还是不是很满意！经过和很多大神讨论，沟通和参考，我总结的这个屏幕适配方案，是目前公认最合理并且最简单的： 废话不多说： 直接上步骤： 1.打开这个链接：https://pan.baidu.com/s/1dEFu3x3下载
转载
2024-04-01 08:17:39
61阅读
前言rem 这个单位对于前端来说并不陌生了,在移动端适配方面,我们经常会用到它,通常我们会采用类似淘宝flexible.js的方案, 写px,然后通过插件转化成rem。现在已经许多兼容性问题现在不再那么头疼了,因此我们现在有了更好的适配方案(不需要计算插件,不需要写js代码).设置meta为移动端<meta name="viewport" content="width=device-widt
转载
2024-10-14 12:31:41
78阅读
移动 web 适配 rem.js 使用前言提到rem，大家首先会想到的是em，px，pt这类的词语，大多数人眼中这些单位是用于设置字体的大小的，没错这的确是用来设置字体大小的，但是对于rem来说它可以用来做移动端的响应式适配哦。兼容性先看看兼容性，关于移动端 ios：6.1系统以上都支持 android：2.1系统以上都支持 大部分主流浏览器都支持，可以安心的往下看了。rem设置字体大小 rem是
vue3+cli4.x+lib-flexible+postcss-pxtorem的移动端与大屏幕适配方案一、安装并配置相应插件1.安装lib-flexible与postcss-pxtorem2.配置lib-flexible与postcss-pxtorem配置 postcss-pxtorem 设置页面px自动转换为rem按需修改 lib-flexible 源码配置二、设置移动端适配三、注意问题 一、
在vue移动端项目开发中，按照UI设计图尺寸开发并且需要进行各屏幕的适配时，我们单独使用rem,vm,vh时极度不方便，所以笔者经过探索，调试，参考。总结出两种统一适配的方式:1.px转rem进行屏幕适配；2.px转viewport(vm,vh)进行屏幕适配px转rem进行屏幕适配1.首先需要在vue工程中进行安装(安装之后，运行程序时可能会出现报错，笔者遇到的是版本问题，所以就安装了指定的版本)
转载
2024-06-24 07:48:12
1222阅读
正在阅读：win10怎样恢复Windows窗口默认的大小？win10怎样恢复Windows窗口默认的大小？2018-04-10 15:56作者：佚名责任编辑：linshitang现在，使用win10系统的用户越来越多了，不过他们也会遇到一些问题。比如，一位朋友想要在win10系统中恢复Windows窗口默认的大小，可是不懂得如何操作。其实，文件资源管理器的窗口位置和大小，窗口位置都是可以进行鼠标拖
转载
2024-03-22 14:22:40
172阅读
现今 社会上的手机花样各种各样，款式繁多，屏幕的尺寸更是多如牛毛，作为一个android开发人员，给自己的app做屏幕适配也是必须具有的。但是android手机屏幕尺寸不一，又该怎样去让自己的app去适应市场上更多的尺寸屏幕的手机呢？
首先做屏幕适配前 ， 搞清楚android手机屏幕适配的概念：1.屏幕尺寸屏幕的物
转载
2024-06-15 20:50:24
74阅读
# 监听屏幕大小变化的实现方法
## 1. 引言
在网页开发中，经常会遇到需要根据屏幕大小来进行不同的布局和样式调整的情况。而实现屏幕大小变化的监控和处理，jQuery提供了相应的方法和事件，可以方便地实现这一功能。本文将介绍如何使用jQuery来监听屏幕大小的变化，并根据不同的屏幕大小进行相应的操作。
## 2. 实现步骤
下面是整个实现过程的步骤表格：
步骤 | 说明
--- | --
原创
2024-01-08 09:56:08
111阅读
当今手机种类繁多 且不说iphone系列，安卓手机的种类已经数不胜数了，所以不可能每一款手机都要写一套布局样式，这也是不可能做到的，但是对于越来越精益求精的前端来说 ，当然要找到一个合理的解决方案。rem 就是用来自适应布局的。适配要达到的效果，如下图(简单的示范一下)两个div不论在大屏还是小屏上都是占据屏幕的一半虽然上面这种简单的使用百分比可以实现但是，百分比无法实现字体的自适应，百分比转换成
rem 作为一个低调的长度单位，由于手机端网页的兴起，在屏幕适配中得到重用。使用 rem 前端开发者可以很方便的在各种屏幕尺寸下，通过等比缩放的方式达到设计图要求的效果。 rem 的官方定义『The font size of the root element.』，即以根节点的字体大小作为基准值进行长
原创
2022-05-12 17:17:13
604阅读
使用rem适配已经快一年了，感觉还是不错的，在这里记录一下。 ##1.原理 rem是一个相对单位，相对的是根元素‘html’的字号。比如html的font-size:100px;那么1rem=100px；html的font-size:120px;那么1rem=120px；所以我们可以根据手机不同的尺寸，设置不同的根元素字体，来适应不同的屏幕。而且它兼容性好，从安卓2.1就支持rem。举个栗子：/
在实现页面的某些效果时，我们经常会用到JavaScript去获取浏览器窗口，页面中元素和屏幕的大小，而这三个的大小在不同的浏览器中获取的方式有所不同，所以不得不处理一些兼容性问题。一、屏幕的大小 首先来看屏幕大小，什么是屏幕大小呢？屏幕大小是指当前所用设备的屏幕的分辨率（浏览器窗口外部显示器的大小），它一般是不变的。它们可以通过JavaScript中的screen对象的属性获取。screen.h
转载
2024-03-29 14:01:34
294阅读
性能分析 借助插件 webpack-bundle-analyzer 先安装运行npm install webpack-bundle-analyzer –save-dev配置在vue.congfig.js中配置好 BundleAnalyzerPlugin 代码如下 const BundleAnalyzerPlugin = require('webpack-bundle-ana
目录引子屏幕尺寸像素分辨率devicePixelRatio参考资料最开始写页面的时候，对页面里面的 px 还是蛮好奇的，电脑上的分辨率好像正好跟页面渲染的宽度值对应，但手机里面却不是这样的，记得当时还去找了相关资料，好像知道是怎么回事。最近脑海里再次想起了这个问题，但已经不知道该如何表述，又没有相关的笔记，这个觉得有必要区分一下相关的概念。OriginMy GitHub屏幕尺寸是指屏幕对角线的尺寸
续上触摸事件 - 当用户触摸屏幕时触发（敲击和滑动） 滚动事件 - 当上下滚动时触发 方向事件 - 当设备垂直或水平旋转时触发 页面事件 - 当页面被显示、隐藏、创建、加载以及/或卸载时触发一、初始化事件1. ready 事件 页面加载完成$(document).ready(function(){
//your code here...
}); 2. 页面加载完成事件二 pageinit$
转载
2023-12-13 01:10:32
43阅读
我们可以知道，页面主体中规中矩，分为两部分：上半部分是介绍页面，下半部分是主体界面，有一个点击按钮来负责全部用户交互，为了适配iphone4到6plus以及众多安卓，我们对整个页面的架构可以有如下几种方案：01-高度百分比高度百分比方案——整个屏幕的主要高度高度都用百分比定位，比如介绍部分占高度的百分之30，点击抢红包部分占剩下的百分之70。优点——易于理解好上手缺点——由于行内样式，行间样式和它
rem适配一, 网易适配方法 屏幕宽度/设计稿rem宽度=页面动态font-size值（如：375/7.5=50） document.documentElement.style.fontSize = document.docum
转载
2024-06-30 12:29:26
122阅读
