经常会遇到需要获取屏幕宽度、高度，可视区域宽度、高度等问题，也就常跟这几个打交道，一不小心，还真爱弄混淆了。 先来列举下这几个吧： screen.availHeight、screen.availWidth； screen.height、screen.width； document.documentE ...
分类：
其他好文 时间：
2017-09-30 20:57:11
阅读次数：
140
1.首先需要看设计稿是多少(750px)，根据设计稿在设置rem，也就是设置html的字体大小，25*30=750 ...
分类：
其他好文 时间：
2017-09-28 21:12:55
阅读次数：
220
今天帮别人做了一个兼容pc端和移动端的页面，正好温习了一下媒体查询的知识。 1、@media screen and （ max-width : 600px ）{ /*屏幕宽度<=600px的样式*/ } 2、@media screen and （ min-width : 600px ）and （ma ...
分类：
其他好文 时间：
2017-09-22 00:48:20
阅读次数：
99
在手机页面的中，头像显示的div，第一行的最后一个为点击显示更多的按钮（more），因为手机宽度的大小不一致，所以每行显示的头像个数也不一致，more按钮的位置总是固定在最后一排，所以需要通过计算屏幕宽度的大小，然后根据每个li的大小算出一行中最多能放几个，然后在将more通过js插入，如下图 iP ...
分类：
移动开发 时间：
2017-09-16 11:39:40
阅读次数：
249
所以此技术只适用于对兼容性没有严格要求的一些项目。 三、结束语 其实很多效果，我们直接在结束当前页面的window上下文预览也没什么，但是有一些效果就不行，例如，预览针对响应式布局的media屏幕宽度查询下的效果，必须是真实的窗体宽度才会触发CSS查询语句的执行，此时，只能在<iframe>中预览， ...
分类：
Web程序 时间：
2017-09-10 16:36:12
阅读次数：
159
console.log(window); console.log(screen.width);//屏幕宽度 console.log(screen.height);//屏幕高度 console.log(screen.availWidth);//可用宽度 console.log(screen.avail ...
分类：
Web程序 时间：
2017-09-04 09:52:17
阅读次数：
364
一、编写触摸屏网页注意点 1、控制缩放行为。内容宽度为屏幕宽度，初始缩放比例为1:1，并禁止缩放（如若可放大缩小，影响操作体验） 2、<a>标签点击存在暗色透明背景问题，使用css属性 -webkit-tap-highlight-color，设置rgba值透明度为0即可。 3、阻止触摸屏上浏览器默认 ...
分类：
Web程序 时间：
2017-08-30 13:12:30
阅读次数：
296
一、目录结构: 获取屏幕宽度与高度 获取设备版本号 获取iPhone名称 获取app版本号 获取电池电量 获取当前系统名称 获取当前系统版本号 获取通用的唯一识别码UUID 获取当前设备IP 获取总内存大小 获取当前可用内存 获取精准电池电量 获取电池当前的状态（共有4种状态） 获取设备当前的语言 ...
分类：
移动开发 时间：
2017-08-29 17:19:23
阅读次数：
257
BOM Screen对象 console.log(window.width);//屏幕宽度 console.log(window.height);//屏幕高度 console.log(window.availWidth);//屏幕可用宽度 console.log(window.availHeight ...
分类：
Web程序 时间：
2017-08-28 00:47:01
阅读次数：
225
影响因素：1 设备物理像素 2 缩放 3 dpr 设置理想视口 <meta name="viewport" content="width=device-width,initial-scale=1.0"> 方法1 固定高度，宽度自适应：垂直方向用定值，水平方向百分比、定值、flex都行。 原理：<me ...
分类：
移动开发 时间：
2017-08-25 01:16:57
阅读次数：
188
