大家好,又见面了,我是你们的朋友全栈君。
移动端开发绪论
今天开始,我们步入移动web前端开发的模块,在我们学习移动端开发之前,我们先来了解一下移动端开发的基础常识!
通常移动端开发主流方案一共有两种
- 一种是单独制作移动端页面,目前在市场上是主流方案
- 还有一种是响应式页面兼容移动端这种虽然不是主流方案,但是应用这种开发方案的也不是没有.
我们访问移动端页面可以通过以下两种方式进行访问:
-
网址域名加m(mobile)就可以直接访问页面的移动端页面
-
使用移动设备,进行访问,则可以直接跳转到移动端页面
又到了我们最头疼的浏览器的兼容性问题
-
移动端浏览器基本以
webkit
内核为主,因此我们只需要考虑webkit
兼容性问题即可。 -
移动端浏览器中我们可以放心使用
H5
标签和CSS3
样式,这两者不会引起浏览器的兼容性问题。 -
同时我们浏览器的私有前缀我们只需要考虑添加
webkit
即可
在移动端中我们会大量使用 CSS3盒子模型box-sizing
因为传统模式和CSS3这两种盒子模型,CSS3更适合我们的移动端开发.
- 传统模式盒子宽度计算:盒子的宽度 = CSS中设置的width + border + padding
- CSS3盒子模型宽度计算:盒子的宽度= CSS中设置的宽度width 里面包含了 border 和 padding
通过以上可以得出,我们的CSS3中的盒子模型, padding 和 border 是不会撑大盒子的
在我们的移动端可以全部使用CSS3 盒子模型
PC端如果需要兼容,我们就用传统模式,如果不考虑兼容性,我们就选择 CSS3 盒子模型
了解完移动端基础常识以后,后面我会为大家陆续更新移动端的布局以及一些典型的案例来帮助大家深入了解移动端的开发!希望大家继续关注!一起努力!
发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/152697.html原文链接:https://javaforall.cn
【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛
【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...