HTML5开发Web移动端APP技巧

小编:一、以配置移动开发环境的方法很多初学者都因为不知道怎么才能将自己在电脑上写的页面放到手机中测试,其实很简单。

使用HTML5开发Web移动端APP技巧——入门篇

发布时间:-02-15作者:本站编辑浏览次数:

摘要:一、以配置移动开发环境的方法很多初学者都因为不知道怎么才能将自己在电脑上写的页面放到手机中测试,其实很简单,只要有以...

一、以配置移动开发环境的方法

很多初学者都因为不知道怎么才能将自己在电脑上写的页面放到手机中测试,其实很简单,只要有以下几个原材料就可以了:

1、XAMMP或其他集成环境

2、自己能用电脑开一个WiFi热点

3、有一个移动设备,并且连接到服务器所在电脑的WiFi上

接下来就可以在手机里像浏览正常网页一样浏览服务器的网页了。

首先打开控制台,输入

然后将你的手机连接到

.34.22.1:/路径地址

点击进入,这样就可以在手机里看到本地服务器里的页面了!测试成本是不是很低!

二、移动设备HTML代码基本结构

在这有两个地方很重要:

1、:

2、

:

三、清楚HTML5默认样式

作为资深的前端开发者,相信这一步大家都不会陌生了,当然也有专门的css文件可以直接引入去除默认样式,但作为一个环节,还是在这写一下吧:

article,aside,canvas,details......(各种省略){

margin:0;

padding:0;

border:0;

font-size:%;

font:inherit;

vertical-align:baseline;

}

四、响应式设计

响应式设计非常有用,接触前端久一点的人应该都深入的学习过,主要就是通过mediaquery的方式进行设计,例如:

mediascreenand(min-width:px){

//样式

}

这句话就说明了屏幕的宽度大于的时候显示的样式

五、关于图标

要为自己设计的

-pre







































白癜风哪个医院看较好
北京中科白癜风医院医生



转载请注明:http://www.guyukameng.com/html/html1/10592.html

  • 上一篇文章:
  •   
  • 下一篇文章: 没有了