多栏网页的布局方法及装置与流程

文档序号:12063833阅读:来源:国知局

技术特征:

1.一种多栏网页的布局方法,包括:

设置用于存储所述多栏网页的网页内容的父容器;

在所述父容器内设置多个分别用于存储对应栏的栏目数据元素的子容器,将所述父容器的高度定义为各个子容器对应的最大高度;

在所述父容器内设置填补元素,通过绝对定位将所述填补元素固定在所述父容器的底部;

设置所述填补元素的层级,使所述填补元素的层级低于所述栏目数据元素的层级。

2.根据权利要求1所述的方法,其中,所述在所述父容器内设置填补元素的步骤具体包括:在所述父容器内根据各个栏的栏目数据元素的元素类型设置多个分别与各个栏的栏目数据元素相对应的填补元素;

其中,各个栏的栏目数据元素的元素类型包括:图片类型和/或文本类型,且所述填补元素包括:图片类型的填补元素、和/或文本类型的填补元素。

3.根据权利要求2所述的方法,其中,所述通过绝对定位将所述填补元素固定在所述父容器的底部的步骤进一步包括:

确定各个栏的栏目数据元素在水平方向上对应的坐标范围,分别将各个填补元素固定在与对应栏的栏目数据元素对应的坐标范围内。

4.根据权利要求1-3任一所述的方法,其中,各个子容器的高度等于相应的子容器内存储的栏目数据元素的高度,且各个子容器的顶部与所述父容器的顶部对齐。

5.根据权利要求4所述的方法,其中,所述各个子容器的高度根据存储的栏目数据元素的高度变化进行自适应调整;

其中,当各个子容器的高度相同时,所述父容器内的填补元素处于不可见状态;当各个子容器的高度不同时,高度小于父容器高度的子容器中存储的栏目数据元素所对应的填补元素处于可见状态。

6.一种多栏网页的布局装置,包括:

父容器设置模块,适于设置用于存储所述多栏网页的网页内容的父容器;

子容器设置模块,适于在所述父容器内设置多个分别用于存储对应栏的栏目数据元素的子容器,且所述父容器设置模块进一步用于将所述父容器的高度定义为各个子容器对应的最大高度;

填补元素设置模块,适于在所述父容器内设置填补元素,通过绝对定位将所述填补元素固定在所述父容器的底部;

层级设置模块,适于设置所述填补元素的层级,使所述填补元素的层级低于所述栏目数据元素的层级。

7.根据权利要求6所述的装置,其中,所述填补元素设置模块具体用于在所述父容器内根据各个栏的栏目数据元素的元素类型设置多个分别与各个栏的栏目数据元素相对应的填补元素;

其中,各个栏的栏目数据元素的元素类型包括:图片类型和/或文本类型,且所述填补元素包括:图片类型的填补元素、和/或文本类型的填补元素。

8.根据权利要求7所述的装置,其中,所述填补元素设置模块进一步包括:

设置单元,适于设置父容器内填补元素的元素类型;

固定单元,适于通过绝对定位将所述填补元素固定在所述父容器的底部,并进一步确定各个栏的栏目数据元素在水平方向上对应的坐标范围,分别将各个填补元素固定在与对应栏的栏目数据元素对应的坐标范围内。

9.根据权利要求6-8任一所述的装置,其中,各个子容器的高度等于相应的子容器内存储的栏目数据元素的高度,且各个子容器的顶部与所述父容器的顶部对齐。

10.根据权利要求9所述的装置,其中,所述各个子容器的高度根据存储的栏目数据元素的高度变化进行自适应调整;

其中,当各个子容器的高度相同时,所述父容器内的填补元素处于不可见状态;当各个子容器的高度不同时,高度小于父容器高度的子容器中存储的栏目数据元素所对应的填补元素处于可见状态。

当前第2页1 2 3 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1