移动WEB页面开发

简介: 移动WEB页面开发

一、如今的移动行业:

1.移动互联网的发展

2.智能手机迅速发展

3.移动WEB应用的发展

4.移动端的开发需求逐年增加

二、移动网页开发和pc网页开发的区别:

1.终端设备及浏览器

2.分辨率

3.视口

4.输入特性:

鼠标、键盘

触摸

三、PC端开发浏览器:

Chrome、IE、火狐

四、移动浏览器类型:

内置浏览器、可下载浏览器、代理浏览器、WebView

五、谷歌浏览器测试环境:

1.Emlation:

(1)Device:可以切换设备和型号

(2)Resolution:设备像素

(3)Device pixel ratio:设备像素比

2.NetWork conditions:

(1)Disk cache:磁盘缓冲,默认是不缓冲的

(2)NetWork throttling:网络节流,单击下拉菜单,可以模拟网络测试。

3.Sensors:

(1)Geolocation:模拟地理定位,shanghai,london、莫斯科、东京

lat:经度

lon:纬度

(2)orientation:模拟陀螺仪,这个功能一般用于摇一摇等有重力感应的场景。

α:设备绕Z轴旋转的数值

β:设备绕X轴旋转的数值

γ:设备绕Y轴旋转的数值

六、移动端视口:

1.布局视口:在移动端上,视口与移动浏览器屏幕宽度不在关联,而是完全独立的。(在桌面上浏览器上,浏览器窗口就是约束CSS布局窗口,他决定了用户可以看到什么)

2.视觉视口:在手机上,桌面视口被拆分为两个,布局视口会限制CSS布局,视觉视口会决定用户能看到什么。

3.理想视口:它明确了特定浏览器布局视口的理想尺寸。

七、视口标签:


八、设备像素比:

1.设备像素:是设备屏幕的物理像素,任何设备的物理像素都是固定的。

2.设备像素比:设备像素个数和理想视口的比。

3.DPI:用像素的数量除以屏幕的以英寸为单位的宽度可以得到你的设备每英寸的点数,简称DPI。

九、移动网页开发和PC网页开发的异同:

1.不同点:

(1)适配不同的分辨率和屏幕尺寸

(2)兼容的浏览器

2.相同点:

布局结构

使用的技术

十、使用相对长度单位em来布局网页内容:

1.em的值并不是固定的

2.em会继承父级元素的字体的大小

十一、使用相对长度单位rem来布局网页内容:

1.rem的值并不是固定的

2.rem的值是相对于根节点html而发生变化的(与父节点无关)

目录
相关文章
|
3天前
|
数据安全/隐私保护
那些酷炫的网页你也可以做到——第六篇,小型公司web开发
那些酷炫的网页你也可以做到——第六篇,小型公司web开发
|
4天前
|
Android开发
Android WindowFeature小探究,Android客户端Web页面通用性能优化实践
Android WindowFeature小探究,Android客户端Web页面通用性能优化实践
|
4天前
|
存储 安全 前端开发
第五章 跨域资源共享(CORS):现代Web开发中的关键机制
第五章 跨域资源共享(CORS):现代Web开发中的关键机制
|
3天前
|
JavaScript
js中如何使用工厂方式和构造函数创建对象,web开发项目实例
js中如何使用工厂方式和构造函数创建对象,web开发项目实例
|
3天前
|
JavaScript 前端开发 开发者
在Web开发中,事件处理是一个至关重要的概念
【5月更文挑战第17天】Vue.js的事件处理是其核心特性之一,允许开发者响应用户操作。通过v-on(或@)指令绑定DOM事件到方法,实现交互。事件修饰符如.stop、.prevent等简化处理逻辑。此外,Vue支持自定义事件,便于组件间通信,如子组件通过$emit触发事件,父组件使用v-on监听并响应。理解这些机制能帮助开发者更有效地管理Vue应用的事件流程。
10 0
|
3天前
|
前端开发 JavaScript 算法
探索现代Web开发中的前端框架选择
在现代Web开发中,前端框架的选择是至关重要的。本文将深入探讨各种前端框架的特点和适用场景,帮助开发者了解不同框架的优势和劣势,并为他们提供在项目中做出明智选择的指导。
|
3天前
|
JavaScript Java 测试技术
《手把手教你》系列技巧篇(四十六)-java+ selenium自动化测试-web页面定位toast-下篇(详解教程)
【5月更文挑战第10天】本文介绍了使用Java和Selenium进行Web自动化测试的实践,以安居客网站为例。最后,提到了在浏览器开发者工具中调试和观察页面元素的方法。
14 2
|
3天前
|
设计模式 存储 前端开发
JS的几种设计模式,Web前端基础三剑客学习知识分享,前端零基础开发
JS的几种设计模式,Web前端基础三剑客学习知识分享,前端零基础开发
|
4天前
|
Web App开发 JavaScript 测试技术
《手把手教你》系列技巧篇(四十五)-java+ selenium自动化测试-web页面定位toast-上篇(详解教程)
【5月更文挑战第9天】本文介绍了在Appium中处理App自动化测试中遇到的Toast元素定位的方法。Toast在Web UI测试中也常见,通常作为轻量级反馈短暂显示。文章提供了两种定位Toast元素的技巧.
11 0
|
4天前
|
JSON JavaScript API
使用 Node.js 开发一个简单的 web 服务器响应 HTTP post 请求
使用 Node.js 开发一个简单的 web 服务器响应 HTTP post 请求
12 1