[发明专利]网页的显示方法和浏览器

说明书

技术领域

本发明涉及互联网领域，特别是涉及一种网页的显示方法和浏览器。

背景技术

为了兼容各种显示器尺寸，绝大多说的网站都将主体内容部分集中在一个固定的区域内，例如900像素大小的区域内，随着显示器尺寸的增大，显示器的显示区域增大，远超过网页主题内容的显示区域，从而屏幕的大部分区域只能显示空白或者特定预设的图片。然而千变万化的网页的背景颜色或者图片差异很到，这就导致难以满足对视觉体验要求较高的用户，特别是要求浏览器一体化视觉体验的用户的需要。

针对以上用户对浏览器显示效果的需求，现有的浏览器所采用的方案由：通过扩展改变一些特定页面的背景颜色或者图片；将所有页面的背景都设置成统一的背景色或者图片。图1是根据现有技术中改变特定页面背景图片后某网页的显示效果图，图2是根据现有技术中改变统一背景图片后某网页的显示效果图。

从以上效果图中可以看出以上的解决方案存在两方面的问题：一、影响页面中主体内容显示；二、视觉效果差。因此，以上方案仅能针对特定的页面设置特定背景色或者背景图片，无法适用于大量的视觉分割差异较大的页面，而且无法根据浏览器当前主题的特性进行设置，从而无法与浏览器形成一体化的视觉效果。

发明内容

鉴于上述问题，提出了本发明以便提供一种克服上述问题或者至少部分地解决上述问题的浏览器和相应的网页的显示方法。

基于本发明的一个方面提供了一种网页的显示方法。该网页显示方法包括：获取网页的主题内容区域；计算网页中元素相对于所述主题内容区域的位置关系；根据位置关系设置元素的显示背景；按照设置后的显示背景在浏览器中显示网页。

可选地，获取网页的主题内容区域包括：计算网页中各元素的边界信息；根据边界信息确定主题内容区域。

可选地，根据边界信息确定主题内容区域包括：根据边界信息确定网页中各元素的左边界和右边界；计算右边界的集中区域与左边界的集中区域之间的区域的宽度；判断区域的宽度是否在预设的数值范围内；若是，将右边界的集中区域与左边界的集中区域之间的区域作为主题内容区域。

可选地，根据位置信息确定主题内容区域包括：通过预设的元素选择规则在网页的元素中挑选出主题元素；将主题元素的显示区域作为主题内容区域。

可选地，在通过预设的元素选择规则挑选出主题元素之前还包括：判断网页是否在预设的白名单内；若是，获取白名单中预置的与所述网页对应的元素选择规则。

可选地，计算网页中元素相对于主题内容区域的位置关系包括：分别将元素的左右边界与主题内容区域的左右边界比较；在元素的右边界位于主题内容区域的左边界左侧或者元素的左边界位于主题内容区域的右边界右侧的情况下，确定元素位于主题内容区域之外；在元素的左边界位于主题内容区域的左边界右侧并且在元素的右边界位于主题内容区域的右边界左侧的情况下，确定元素位于主题内容区域内部；在元素的左边界位于主题内容区域的左边界左侧并且在元素的右边界位于主题内容区域的右边界左侧的情况下，或者在元素的左边界位于主题内容区域的左边界右侧并且在元素的右边界位于主题内容区域的右边界右侧的情况下，确定元素部分位于主题内容区域内部。

可选地，根据位置关系设置元素的显示背景包括：分别创建浏览器背景显示层、主题内容背景显示层、元素背景显示层，其中，元素背景显示层位于主题内容背景显示层的上方，主题内容背景显示层位于浏览器背景显示层的上方；对于位于主题内容区域之外的元素，将该元素的背景设置为浏览器背景显示层的内容；对于位于主题内容区域之内的元素，将该元素的背景设置为主题内容背景显示层的内容；对于部分位于主题内容区域内部的元素，将该元素的背景设置为元素背景显示层的内容。

可选地，根据位置关系设置元素的显示背景的步骤通过浏览器扩展向网页注入css或js文件完成。

基于本发明的另一个方面，提供了一种浏览器。该浏览器包括：主题区域获取模块，用于获取网页的主题内容区域；位置关系计算模块，用于计算网页中元素相对于主题内容区域的位置关系；背景注入模块，用于根据位置关系设置元素的显示背景；显示模块，用于按照设置后的显示背景显示网页。