[发明专利]网页的页面元素的显示方法和装置

说明书

本申请实施例公开了一种网页的页面元素的显示方法和装置。该方法包括：接收服务器发送的背景图片以及文字内容，所述背景图片以及文字内容用于描述一个页面元素；通过级联样式表CSS技术将所述背景图片以及文字内容显示在当前页面上，以使得显示在当前页面上的所述背景图片以及文字内容与当前页面的尺寸匹配。本申请可以节省banner制作过程中的人力成本，提高工作效率。

技术领域

本申请涉及计算机应用领域，特别是涉及网页的页面元素的显示方法和装置。

背景技术

通常，在网页的页面中包含各种各样的页面元素，例如，文字、图片或者链接等。banner(网幅广告)是页面中一种重要的页面元素，并在整个页面中占据着重要的显示地位。

对于不同的终端来说，由于显示屏的尺寸不同(即，宽度和高度不同)，因此，在显示屏上所显示的页面的尺寸也就不同。即使是同一个终端(如，手机或平板电脑)，当其放置的方向不同时，在显示屏上所显示的页面的尺寸也是不同的。例如，在将手机横着放时显示屏上显示的页面的宽度和高度与在将手机竖着放时显示屏上显示的页面的宽度和高度是不同的。

在相关技术中，为了能够适配不同尺寸的页面，并在不同尺寸的页面上尽量完整地显示出banner中的信息，一般会预先制作不同尺寸的banner以适配不同尺寸的页面。客户端根据当前页面的尺寸，调用相应尺寸的banner，并显示在当前页面上。

但是，在实现本申请的过程中，本申请的发明人发现现有技术中至少存在如下问题：对于每一个主题的banner，为了使其适配不同尺寸的页面，需要制作多个不同的尺寸。而对于一个网站来说(如，购物网站或门户网站)，都会涉及很多主题的banner，因此也就需要制作大量的不同尺寸的banner。由于banner的制作过程是由美工人员手工完成的，因此，会消耗大量的人力成本，降低了工作效率。

发明内容

为了解决上述技术问题，本申请实施例提供了网页的页面元素的显示方法和装置，以节省banner制作过程中的人力成本，提高工作效率。

本申请实施例公开了如下技术方案：

一种网页的页面元素的显示方法，其特征在于，包括：

接收服务器发送的背景图片以及文字内容，所述背景图片以及文字内容用于描述一个页面元素；

通过级联样式表CSS技术将所述背景图片以及文字内容显示在当前页面上，以使得显示在当前页面上的所述背景图片以及文字内容与当前页面的尺寸匹配。

优选的，所述当前页面的尺寸为当前页面的宽度。

优选的，所述通过CSS技术将所述背景图片显示在当前页面上，以使得显示在当前页面上的所述背景图片与当前页面的宽度匹配，包括：

通过CSS技术确定所述背景图片的显示区域，以使得所述背景图片的显示区域的宽度与当前页面的宽度匹配；

将所述背景图片的显示区域渲染在当前页面上；

其中，所述背景图片的显示区域与所述背景图片之间左对齐，并且，所述背景图片的显示区域的左边界与所述背景图片的左边界之间的距离满足预设的第一距离条件；或者，所述背景图片的显示区域与所述背景图片之间右对齐，并且，所述背景图片的显示区域的右边界与所述背景图片的右边界之间的距离满足预设的第二距离条件；或者，所述背景图片的显示区域与所述背景图片之间居中对齐，并且，将所述背景图片的显示区域的左边界与所述背景图片的左边界之间的距离作为第一距离，将所述背景图片的显示区域的右边界与所述背景图片的右边界之间的距离作为第二距离，所述第一距离与所述第二距离的比值满足预设的比值条件。

优选的，当响应于用户对当前页面的页面缩小操作时，如果用户向左拉动当前页面，所述第二距离大于所述第一距离，如果用户向右拉动当前页面，所述第一距离大于所述第二距离。