应用之星：最好用的H5制作平台-附H5制作教程

Posted 2020-08-11 ddwendy

H5是html5的简称。HTML5是HTML最新的修订版本，是一种超文本标记语言。H5有两大特点：首先，强化了 Web 网页的表现性能。其次，追加了本地数据库等 Web 应用的功能。

H5页面就是利用html5制作出来的页面，在微信朋友圈非常火爆，那么今天通过应用之星平台跟大家分享一下H5制作过程。

首先：进入应用之星网站，注册账号并激活。

其次：点击“应用制作”，进入的页面将看见“高级模式”。在高级模式下，你可以直接使用系统模板，也可以自己新建应用，根据自己的需要选择。

• 极简模式：里面有一键淘宝，一键电子书，一键图文等等，以最少的步骤，最短的时间让您创作出简单热门的手机应用app；

• 高级模式：提供了多样化的模板。您可以选择一款，按照样式逐步编辑即可获得精美H5页面，同时也支持您扩展编辑；另外也可以自己新建H5页面，采用纯自由的控件式操作，完全由您自由设计每个页面内容及其之间的关系，各式H5页面随心创建。

下面介绍的是自己新建一个H5页面。

第一步：点击“我要创建”，弹出的窗口输入你将要设计的H5页面的“名称”和选择类型，如图：

第二步：点击“创建”后，进入H5页面的制作区域，这里你将看到各类控件、我的模板、系统模板等，如图：

• 我的模板：是指你自己将认为比较好的页面设置成自己的模板，请看教程：那么如何将自己制作的页面加入到系统模板里？

• 系统模板：是指应用之星提供的模板。

第三步：点击控件来制作H5页面，根据你H5页面的内容需要，进行控件选择使用，比如我要用文本控件，直接点击“文本”，然后制作区域将出现“请输入文字”，再点击“请输入文字”，将弹出文本的属性框，进行编辑和设置动画，如图：

在这里的制作区域，有几点需要注意的：

1、拉动每个控件，都会出现辅助线，用来调整对齐。在设置文本控件的时候，注意设置行间距，不要让文字堆积在一起。

2、设置动画的时候，注意先设置时间，再选择动画方式，如图：

3、所有控件右键可以调出快捷键使用，如图：

4、调整圆角或透明度的时候，可以结合键盘的上下左右键一起使用。

5、调整字体颜色或者边框颜色的时候，先拖动右边的滑动按钮，再拖动左边的小圈按钮，如图：

 

6、新建页面，在右边导航下部，如图：

7、所有制作的页面都可以拖动，删除，但前提是在编辑状态下，即先点击编辑才可进行删除或拖动。动作完成后，再次点击编辑，即可关闭编辑功能；（当做第二页面时，可以直接复制第一个页面，如果是类似的页面，复制的目的是节省时间，减少重复操作。）

8、在制作H5页面的同时，如果你还想生成android应用或ios应用，去“设置”——>“高级”里进行，如图：

生成Android应用或iOS应用，具体可以看教程：

不懂技术，如何生成Android应用？

不懂技术，如何生成iOS应用？

更多使用技巧，请看教程：（必读）在应用制作时，你应该先知道的制作技巧

第四步：当你一切制作好后，点击“发布”，即可生成二维码，微信扫描WEB二维码，将你的H5页面分享到朋友圈吧，如图：

最后，如果你想修改H5页面，那么去个人中心——>应用管理里进行修改；如果你自信自己做的H5页面也想被更多人欣赏，那么去个人中心——>应用管理里进行优秀案例申请，我们将在1-3个工作日审核，审核通过后，将在网站的优秀案例里展示给更多网友欣赏学习！