我们切换到创建页面的"第二步:页面布局",此时则会列出已有的布局样式,可以根据需要选择使用。
成功设置了页面的布局后,在“添加资源”页中将显示该布局样式,各区域有明显的分界线。如我们选择两列布局,则切换到添加资源界面。如下图所示。
布局管理是指对布局的进行创建、修改、删除等管理操作。
页面布局可以分为系统内置布局、自定义普通布局和自定义HTML5模板布局三种。
布局管理包含新增、设置、删除布局。
布局列表,下面是对布局列表设置项的说明表,请对照参考:
布局种类 | 名称 | 图标 | 操作 |
---|---|---|---|
内置布局的名称,无法修改 | 内置布局的显示图标 | 无操作 | |
自定义布局的名称,可以修改 | 自定义布局的显示图标,可以修改 |
| |
自定义布局的名称,可以修改 | 自定义布局的显示图标,可以修改 |
|
产品内置9种布局,产品内置布局是不允许修改的。具体说明如下:
布局类型 | 说明 |
---|---|
1列 | 整个页面是一个区域。该类型为布局的默认样式。 |
2列 | 页面从水平方向上被分成两个区域,且两个区域大小均等。 |
2列_3_7开 | 页面从水平方向上被分成两个区域,且两个区域从左至右按3_7开划分。 |
2列_7_3开 | 页面从水平方向上被分成两个区域,且两个区域从左至右按7_3开划分。 |
3列 | 页面从水平方向上被分成三个区域,且三个区域大小均等。 |
2行(1-2column)_3_7开 | 页面分别从垂直方向和水平方向共被分成三个区域,且上下、左右的分配比例都为3_7开。 |
2行(1-2column)_7_3开 | 页面分别从垂直方向和水平方向共被分成三个区域,且上下分配比例为3_7开,左右的分配比例为7_3开。 |
3行(1-2-1column) | 页面分别从垂直方向和水平方向共被分成四个区域,垂直方向上被分成三行,中间行又被分成两列,且垂直方向上的三个区域大小均等,水平方向上的两个区域大小均等。 |
2行2列 | 页面分别从垂直方向和水平方向共被分成四个区域,垂直方向上被分成两行,每一行又被分成两列,且垂直方向上的两个区域大小均等,第一行水平方向上的两个区域从左到右的分配比例为7_3开,第二行水平方向上的两区域从左到右的分配比例为3_7开。 |
如果上述布局还不满足展示要求,还可以在页面管理界面单击 自定义布局 按钮自定义布局。详细信息请参见自定义布局。
除各内置的布局样式外,还允许用户自定义布局样式,以满足个性化展现的需要。
关于自定义布局,可以参考如下示例。
使用产品默认模板能快速的生成页面,但是这些页面的风格会比较雷同。当我们需要制作一些高度个性化的页面的时候,就需要使用产品里面的HTML模板功能了。使用HTML布局不需要任何的编码知识,但需要对HTML静态页面有一定的基础,并已经掌握产品的普通页面制作方法。HTML布局设置可以参考布局说明,点击 HTML布局说明 按钮,则会弹出如下说明对话框。
关于HTML布局,可以参考如下示例。