视频教程1：页面结构简介

视频教程2：四个页面实际应用

一、页面结构

为方便大家理解Masterpage／页面／Background三个页面间的关系，以及Layer 页面的用法，用一个简单的结构图示来讲解。

二、页面详解

1.页面/Page

2.MasterPage。Masterpage，简称M页。也可以称之为母版。M页元素可以在所有页面中显示。

（1）M页可放置图片、文字、背景音乐、视频、全局参数等，可制作全局的导航按钮等。要想修改或删除这些元素，也只能在Masterpage上修改。

（2）M页在所有页面的最顶层，并且只有一页，M页上的元素支持定位。  

（3）Masterpage放置元素——切换至页面预览效果。

（4）如果不想某个页面显示M页的元素，可以去掉页面上的显示M页的设置。

3.Background页，后面简称B页。可作为整个H5作品的背景。  在B页中添加元素时，每个页面都会显示B页上的元素，若要修改背景图也必须在B页中修改。        

（1）若想在页面中看见B页上的元素，需要查看右侧属性面板是否已勾选【显示Background】；并将页面的不透明度调低，里面的元素才可显示。

（2）注意：按照页面结构逻辑，页面覆盖于Background页面的上方，在Background页面的元素只具备自身以及自身动画的展示功能，元素并不能被手势接触到，因此放置在B页里的元素无法设置触发器。

（3）B页在所有页面最底层，并且只有一页，B页的元素支持定位。

（4）B页放置元素——切换至页面预览效果。

4.小结提示：Masterpage跟Background都只有一个，但页面可以新建或复制多个。

5.Layer（需要结合Layer容器等组件使用）

6.Layer页面的用法：主要是用来编辑高级组件内的内容。本身和其他三个页面的逻辑关系割裂，以组件的形式放置在其他页面显示。如下图：

操作顺序：Layer页面放置元素——切换至页面添加Layer组件——预览效果。