CN106371815A - 一种网页皮肤半透明化显示的方法及装置 - Google Patents

Abstract

本发明提供了一种网页皮肤半透明化显示的方法及装置。其中，该方法包括：识别网页中类型为预设类型的网页元素作为待处理网页元素；根据每个待处理网页元素的类型和背景属性，分别对每个待处理网页元素进行半透明化处理；显示经半透明化处理后的每个网页元素。通过本发明，对待处理网页元素进行半透明化处理，避免了网页内容区域对网页皮肤的遮挡，显示的网页层次感强，大大改善了网页皮肤的显示效果。

Description

一种网页皮肤半透明化显示的方法及装置

技术领域

本发明涉及互联网及终端技术领域，具体而言，涉及一种网页皮肤半透明化显示的方法及装置。

背景技术

目前，用户经常通过浏览器浏览网页，为了增加浏览网页的趣味性，可以为网页设置网页皮肤，在显示网页内容的同时显示该网页的网页皮肤，以满足用户对网页视觉效果的个性化需求。

当前，相关技术中提供了一种显示网页皮肤的方法，包括：当用户请求浏览网页时，终端获取用户事先设置的网页皮肤的链接或存储路径，将该链接或存储路径添加到网页的源代码中。在显示该网页时直接根据该链接或存储路径拉取并显示该网页的网页皮肤。

在实现本发明的过程中，发明人发现上述显示网页皮肤的方法至少存在以下问题：

直接显示网页的网页皮肤时，网页的内容区域会遮挡网页皮肤，致使网页皮肤的大部分无法显示，导致显示的网页没有层次感，显示网页皮肤的效果很差。

发明内容

有鉴于此，本发明实施例的目的在于提供一种网页皮肤半透明化显示的方法及装置，避免了网页内容区域对网页皮肤的遮挡，显示的网页层次感强，网页皮肤的显示效果好。

第一方面，本发明实施例提供了一种网页皮肤半透明化显示的方法，所述网页中设置有网页皮肤，所述方法包括：

识别所述网页中类型为预设类型的网页元素作为待处理网页元素；

根据每个所述待处理网页元素的类型和背景属性，分别对每个所述待处理网页元素进行半透明化处理；

显示经半透明化处理后的每个网页元素。

结合第一方面，本发明实施例提供了上述第一方面的第一种可能的实现方式，其中，所述根据每个所述待处理网页元素的类型和背景属性，分别对每个所述待处理网页元素进行半透明化处理，包括：

根据待处理网页元素的类型及背景属性，确定所述待处理网页元素对应的透明程度；

根据确定的所述透明程度，为所述待处理网页元素设置指示所述透明程度的属性值。

结合第一方面，本发明实施例提供了上述第一方面的第二种可能的实现方式，其中，所述方法还包括：

判断在所述待处理网页元素的显示区域内，所述待处理网页元素的颜色与网页皮肤颜色的色相值之差是否小于预设阈值；

若是，则修改所述待处理网页元素的颜色，所述待处理网页元素的修改后的颜色与其显示区域内的网页皮肤的颜色的色相值大于所述预设阈值。

结合第一方面，本发明实施例提供了上述第一方面的第三种可能的实现方式，其中，所述方法还包括：

获取所述网页的网页皮肤的主题颜色；

检测每个所述待处理网页元素的颜色，当检测到一待处理网页元素的颜色的色相值与所述主题颜色的色相值之差小于预设阈值时，将所述待处理网页元素的颜色修改为所述主题颜色对应的预设颜色。

结合第一方面的第一种可能的实现方式，本发明实施例提供了上述第一方面的第四种可能的实现方式，其中，所述根据待处理网页元素的类型及背景属性，确定所述待处理网页元素对应的透明程度，包括：

当待处理网页元素的类型及背景属性为第一类时，确定所述待处理网页元素的透明程度为全透明，所述第一类为以下中的任意一种：所述待处理网页元素的类型为主体类型、所述待处理网页元素的类型为具体内容类型且无背景色、所述待处理网页元素的类型为具体内容类型且背景色为白色；

当所述待处理网页元素的类型及背景属性为第二类时，确定所述待处理网页元素对应的透明程度为预设的透明程度，所述第二类为以下中的任意一种：所述待处理网页元素的类型为标题或页脚类型且无背景色、所述待处理网页元素的类型为具体内容类型且有非白色的背景色。

结合第一方面的第一种或第四种可能的实现方式，本发明实施例提供了上述第一方面的第五种可能的实现方式，其中，所述根据确定的所述透明程度，为所述待处理网页元素设置指示所述透明程度的属性值，包括：

当确定的所述透明程度为全透明时，在所述待处理网页元素的背景属性中添加色彩空间RGBA属性，设置所述RGBA属性的值为指示所述全透明的属性值；

当确定的所述透明程度为预设的透明程度时，设置所述背景属性指示背景色为白色，在所述背景属性中添加RGBA属性，设置所述RGBA属性的值为指示所述预设的透明程度的属性值。

结合第一方面的第五种可能的实现方式，本发明实施例提供了上述第一方面的第六种可能的实现方式，其中，所述方法还包括：

当所述待处理网页元素的背景图片类型为渐变颜色类型时，删除其背景属性中的背景图属性，设置其背景属性指示背景色为白色，并设置其背景属性的RGBA属性的值为指示所述预设的透明程度的属性值。

结合第一方面，本发明实施例提供了上述第一方面的第七种可能的实现方式，其中，所述识别所述网页中类型为预设类型的网页元素作为待处理网页元素，包括：

从所述网页的源代码的起始处开始遍历所述源代码包括的网页元素；根据遍历到的所述网页元素的标签类型，识别类型为预设类型的网页元素作为待处理网页元素；或者，

根据预设的分段字符串将所述源代码划分为多个代码段，并行遍历所述多个代码段包括的网页元素，分别识别所述多个代码段包括的类型为预设类型的网页元素作为待处理网页元素。

第二方面，本发明实施例提供了一种网页皮肤半透明化显示的装置，所述网页中设置有网页皮肤，所述装置包括：

识别模块，用于识别所述网页中类型为预设类型的网页元素作为待处理网页元素；

半透明化处理模块，用于根据每个所述待处理网页元素的类型和背景属性，分别对每个所述待处理网页元素进行半透明化处理；

显示模块，用于显示经所述半透明化处理模块处理后的每个网页元素。

结合第二方面，本发明实施例提供了上述第二方面的第一种可能的实现方式，其中，所述半透明化处理模块包括：

确定单元，用于根据待处理网页元素的类型及背景属性，确定所述待处理网页元素对应的透明程度；

设置单元，用于根据所述确定单元确定的所述透明程度，为所述待处理网页元素设置指示所述透明程度的属性值。

结合第二方面，本发明实施例提供了上述第二方面的第二种可能的实现方式，其中，所述装置还包括：

第一修改模块，用于判断在所述待处理网页元素的显示区域内，所述待处理网页元素的颜色与网页皮肤颜色的色相值之差是否小于预设阈值；若是，则修改所述待处理网页元素的颜色，所述待处理网页元素的修改后的颜色与其显示区域内的网页皮肤的颜色的色相值大于所述预设阈值。

结合第二方面，本发明实施例提供了上述第二方面的第三种可能的实现方式，其中，所述装置还包括：

第二修改模块，用于获取所述网页的网页皮肤的主题颜色；检测每个所述待处理网页元素的颜色，当检测到一待处理网页元素的颜色的色相值与所述主题颜色的色相值之差小于预设阈值时，将所述待处理网页元素的颜色修改为所述主题颜色对应的预设颜色。

结合第二方面的第一种可能的实现方式，本发明实施例提供了上述第二方面的第四种可能的实现方式，其中，所述确定单元包括：

第一确定子单元，用于当待处理网页元素的类型及背景属性为第一类时，确定所述待处理网页元素的透明程度为全透明，所述第一类为以下中的任意一种：所述待处理网页元素的类型为主体类型、所述待处理网页元素的类型为具体内容类型且无背景色、所述待处理网页元素的类型为具体内容类型且背景色为白色；

第二确定子单元，用于当所述待处理网页元素的类型及背景属性为第二类时，确定所述待处理网页元素对应的透明程度为预设的透明程度，所述第二类为以下中的任意一种：所述待处理网页元素的类型为标题或页脚类型且无背景色、所述待处理网页元素的类型为具体内容类型且有非白色的背景色。

结合第二方面的第一种或第四种可能的实现方式，本发明实施例提供了上述第二方面的第五种可能的实现方式，其中，所述设置单元包括：

第一设置子单元，用于当确定的所述透明程度为全透明时，在所述待处理网页元素的背景属性中添加色彩空间RGBA属性，设置所述RGBA属性的值为指示所述全透明的属性值；

第二设置子单元，用于当确定的所述透明程度为预设的透明程度时，设置所述背景属性指示背景色为白色，在所述背景属性中添加RGBA属性，设置所述RGBA属性的值为指示所述预设的透明程度的属性值。

结合第二方面的第五种可能的实现方式，本发明实施例提供了上述第二方面的第六种可能的实现方式，其中，所述设置单元，还用于当所述待处理网页元素的背景图片类型为渐变颜色类型时，删除其背景属性中的背景图属性，设置其背景属性指示背景色为白色，并设置其背景属性的RGBA属性的值为指示所述预设的透明程度的属性值。

结合第二方面，本发明实施例提供了上述第二方面的第七种可能的实现方式，其中，所述识别模块包括：

第一识别单元，用于从所述网页的源代码的起始处开始遍历所述源代码包括的网页元素；根据遍历到的所述网页元素的标签类型，识别类型为预设类型的网页元素作为待处理网页元素；或者，

第二识别单元，用于根据预设的分段字符串将所述源代码划分为多个代码段，并行遍历所述多个代码段包括的网页元素，分别识别所述多个代码段包括的类型为预设类型的网页元素作为待处理网页元素。

在本发明实施例提供的方法及装置中，根据每个待处理网页元素的类型和背景属性，分别对每个待处理网页元素进行半透明化处理，然后显示经半透明化处理后的每个网页元素。如此透过半透明化处理的网页元素能够看到完整的网页皮肤，缓解了网页内容区域对网页皮肤的遮挡，使显示的网页层次感强，大大改善了网页皮肤的显示效果。

为使本发明的上述目的、特征和优点能更明显易懂，下文特举较佳实施例，并配合所附附图，作详细说明如下。

附图说明

为了更清楚地说明本发明实施例的技术方案，下面将对实施例中所需要使用的附图作简单地介绍，应当理解，以下附图仅示出了本发明的某些实施例，因此不应被看作是对范围的限定，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他相关的附图。

图1A示出了本发明实施例1所提供的一种网页皮肤半透明化显示的方法流程图；

图1B示出了本发明实施例1所提供的一种修改待处理网页元素的颜色的示意图；

图1C示出了本发明实施例1所提供的一种非半透明化显示网页皮肤的示意图；

图1D示出了本发明实施例1所提供的一种半透明化显示网页皮肤的示意图；

图2示出了本发明实施例2所提供的一种网页皮肤半透明化显示的装置结构示意图。

具体实施方式

下面将结合本发明实施例中附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。通常在此处附图中描述和示出的本发明实施例的组件可以以各种不同的配置来布置和设计。因此，以下对在附图中提供的本发明的实施例的详细描述并非旨在限制要求保护的本发明的范围，而是仅仅表示本发明的选定实施例。基于本发明的实施例，本领域技术人员在没有做出创造性劳动的前提下所获得的所有其他实施例，都属于本发明保护的范围。

考虑到相关技术中直接显示网页的网页皮肤时，网页内容的显示会遮挡其显示区域的网页皮肤，致使网页皮肤的大部分无法显示，导致显示的网页没有层次感，网页皮肤的显示效果很差。基于此，本发明实施例提供了一种网页皮肤半透明化显示的方法及装置。下面通过实施例进行描述。

实施例1

参见图1A，本发明实施例提供了一种网页皮肤半透明化显示的方法。在本发明中，网页中设置有网页皮肤，网页皮肤包括图片，还可以包括定制按钮等其他多种元素。通过本发明实施例提供的方法对该网页中的网页元素进行半透明化处理，可以使网页皮肤透过半透明化处理的网页元素呈现出来，使显示的网页层次感增强。本发明实施例中，将透明程度分为全透明、半透明和不透明，全透明即100％的透明程度，上层对下层完全无遮挡，不透明即0％的透明程度，上层完全遮挡下层，介于全透明和不透明之间的透明程度为半透明。

该方法具体包括以下步骤：

步骤101：识别网页中类型为预设类型的网页元素作为待处理网页元素；

本发明实施例中，网页元素的类型是按照其标签类型来进行分类的。通常一个网页中包括多个网页元素，以HTML(HyperTextMarkup Language，超文本标记语言)语言编写的网页源代码为例，网页的源代码中包含了很多HTML标签，如分区标签<div>、主体标签<body>、页脚标签<footer>和标题标签<header>等。HTML标签可以分为多种标签类型，如可以分为主体类型、标题类型、页脚类型、具体内容类型或分区类型等。相应的，主体标签<body>的类型即为主体类型，标题标签<header>的类型为标题类型，页脚标签<footer>的类型为页脚类型，标签类型为具体内容类型的标签包括文本、图片和超链接等标签，分区类型的标签为分区标签<div>。从HTML标签的开标签字符串中可以判断出标签的类型，如标签<divid＝“nav”>a</div>的开标签字符串为<div id＝“nav”>，从<divid＝“nav”>中可以判断出该标签的类型为分区标签。

在本步骤中识别类型为预设类型的网页元素的识别操作就是根据标签类型来进行识别的，上述预设类型可以为预先设置的标题类型、页脚类型、具体内容类型和分区类型等标签类型。当然，设计人员也可根据具体显示需求，自定义设置所需识别出的标签的类型，以使这些类型的标签所对应的网页元素进行后续的半透明化处理。

该识别操作具体可以通过如下方式来实现：

首先获取网页的源代码，从网页的源代码的起始处开始遍历源代码，获取遍历到的网页元素的开标签字符串，根据网页元素的开标签字符串确定遍历到的网页元素的标签类型。将网页元素的标签类型与预设类型进行比较，若网页元素的标签类型符合预设类型，则确定该网页元素为待处理网页元素。

通过上述操作，根据遍历到的网页元素的标签类型，识别类型为预设类型的网页元素作为待处理网页元素。后续对待处理网页元素进行半透明化处理，以避免这些待处理网页元素遮挡网页皮肤的显示，实现网页皮肤的完整显示。

在本发明实施例中，由于网页的源代码一般包含很多行代码，从源代码的起始处开始遍历源代码包括的网页元素，需要花费很长时间才能完成对整个网页的源代码的处理，效率比较低。因此为了缩短识别待处理网页元素的时间，提高半透明化处理的效率，还可以通过如下方式来识别待处理网页元素，具体包括：

预先设置分段字符串，预设的分段字符串可以为HTML标签的开标签字符串，如预设的分段字符串可以为分区标签<div>包含的开标签字符串<div id＝“nav”>。获取网页的源代码，根据预设的分段字符串将源代码划分为多个代码段，并行遍历多个代码段包括的网页元素。对于每个代码段，获取遍历到的网页元素的开标签字符串，根据网页元素的开标签字符串确定遍历到的网页元素的标签类型。根据遍历到的网页元素的标签类型，识别该代码段中类型为预设类型的网页元素作为待处理网页元素。

另外，可以通过预设的分段字符串来控制对源代码进行分段得到的代码段的数目，代码段数目越多，后续并行识别多个代码段中包括的待处理网页元素的效率越高。由于源代码中不同HTML标签之间通常具有嵌套关系，可以根据HTML标签之间的嵌套关系来控制分段得到的代码段的数目。例如，分区标签<div>中可以包含列表标签<ul>，列表标签<ul>中又可以包含列表项目标签<li>等，所以在分区标签<div>、列表标签<ul>和列表项目标签<li>三者之间，当预设的分段字符串为分区标签<div>包含的字符串时划分得到的代码段数目最少，预设的分段字符串为列表标签<ul>包含的字符串时划分得到的代码段数目次少，预设的分段字符串为列表项目标签<li>包含的字符串时划分得到的代码段数目最多。

通过上述步骤101的操作从网页中识别出待处理网页元素之后，通过如下步骤102的操作来对待处理网页元素进行半透明化处理。

步骤102：根据每个待处理网页元素的类型和背景属性，分别对每个待处理网页元素进行半透明化处理；

网页元素具有多种属性，可以从网页元素的标签中直接获取网页元素的属性。例如，网页元素的属性包括尺寸属性、背景色属性和背景图属性等，尺寸属性用于指示网页元素的尺寸大小，背景色属性用于指示网页元素是否具有背景色以及背景色的色调，背景图属性用于指示网页元素是否具有背景图片以及背景图片的类型，背景图片的类型可以为渐变颜色类型、内容图类型和纹理图类型。

本发明实施例中待处理网页元素的背景属性包括待处理网页元素的背景色属性及背景图属性。在本步骤中对待处理网页元素进行半透明化处理，需要根据待处理网页元素的类型及背景属性，确定待处理网页元素对应的透明程度。

本发明实施例对网页元素进行半透明化处理的一种具体实施方式中，可以将主体类型、无背景色或背景色为白色的具体内容类型的网页元素设置成全透明；将无背景色的标题或页脚类型、非白色的背景色的具体内容类型的网页元素设置成半透明；其他的网页元素设置成预先设定的透明程度，设置其他网页元素的透明程度时，可以根据网页元素的类型和背景属性，结合一定规则进行设定，也可以由设计人员结合该网页元素的具体的呈现效果，自定义设置其较为合理的透明程度。

按照上述的半透明化处理方式，待处理网页元素的类型和背景属性包括以下两类。第一类可以为以下中的任意一种：待处理网页元素的类型为主体类型、待处理网页元素的类型为具体内容类型且无背景色、待处理网页元素的类型为具体内容类型且背景色为白色。第二类可以为以下中的任意一种：待处理网页元素的类型为标题或页脚类型且无背景色、待处理网页元素的类型为具体内容类型且有非白色的背景色。

对待处理网页元素的类型和背景属性进行上述分类之后，可以将待处理网页元素的类型和背景属性与上述第一类和第二类进行匹配，来确定待处理网页元素属于哪一类，并根据待处理网页元素所属的类别来确定其透明程度，具体包括：

当待处理网页元素为主体标签<body>时，确定待处理网页元素的类型为主体类型，确定待处理网页元素属于上述第一类。当待处理网页元素的标签为文本、图片或超链接等具有具体内容的标签时，确定待处理网页元素的类型为具体内容类型，然后获取待处理网页元素的背景色属性的属性值，若其背景色属性的属性值指示为无背景色或指示为背景色为白色，则确定待处理网页元素属于上述第一类。将属于第一类的待处理网页元素的透明程度确定为全透明。

当待处理网页元素的标签为标题标签<header>时，确定待处理网页元素的类型为标题类型，当待处理网页元素的标签为页脚标签<footer>时，确定待处理网页元素的类型为页脚类型，在确定待处理网页元素的类型为标题类型或页脚类型时，获取待处理网页元素的背景色属性的属性值，若其背景色属性的属性值指示为无背景色，则确定待处理网页元素属于第二类。或者，当待处理网页元素的标签为文本、图片或超链接等具有具体内容的标签时，确定待处理网页元素的类型为具体内容类型，然后获取待处理网页元素的背景色属性的属性值，若其背景色属性的属性值指示为背景色为非白色，则确定待处理网页元素属于上述第二类。将属于第二类的待处理网页元素的透明程度确定为预设的透明程度。预设的透明程度可以为不透明和全透明之间的任意透明程度，可以根据显示需求设置不透明和全透明之间的一透明程度为预设的透明程度。

按照上述的半透明化处理方式，使得类型为主体类型、类型为具体内容类型且无背景色或类型为具体内容类型且背景色为白色的待处理网页元素全透明，以及使得类型为标题或页脚类型且无背景色或类型为具体内容类型且有非白色的背景色的待处理网页元素半透明，使得网页皮肤的整体能够得到较为清晰完整的呈现。对于页面空白较多的网页，如搜索引擎类的网页，能够使得网页皮肤得到很好的呈现，且不会影响其他网页元素的显示，具有较好的网页显示效果。

另外，本领域技术人员能够想到的是，对于不同页面布局的网页，对其网页元素的处理可以采用不同的半透明化处理方式，如对于页面空白较少的网页，则对其网页元素的处理可以采用与上述方式不同的半透明化处理方式。结合上述的实施方式，本发明实施例还可以根据具体的处理需求来设置上述第一类和第二类，第一类和第二类中包含的类型及背景属性的情形并不限定于本发明实施例所列的情形。而且上述具体内容类型也不限定于文本、图片或超链接等标签，对于一些嵌套了包含具体内容的标签的类型也可以为具体内容类型。例如，分区标签<div id＝“nav”><a href＝href＝"http://game.com">游戏</a></div>中嵌套了超链接标签<ahref＝href＝"http://game.com">游戏</a>，则该分区标签的类型可以为具体内容类型。在本发明实施例中，透明程度可以通过数值来进行量化。例如，可以通过[0,100]的数值区间来量化透明程度，0表示透明程度为不透明，100表示透明程度为全透明，而数值0至100之间的数值表示不同程度的半透明。

通过上述操作确定待处理网页元素的透明程度之后，根据确定的透明程度，为待处理网页元素设置指示其透明程度的属性值。

当确定的透明程度为全透明时，查看待处理网页元素的背景属性，若仅设置了RGB(红绿蓝色彩模式)属性，则在待处理网页元素的背景属性中添加Alpha(Alpha Channel，图像通道)通道，即在待处理网页元素的背景属性中添加RGBA(色彩空间)属性，并设置RGBA属性的值为指示全透明的属性值。若一开始待处理网页元素的背景属性中就已经设置了RGBA属性，则直接将RGBA属性的值设置为指示全透明的属性值。例如，若表示透明程度的数值区间为[0,100]，则设置RGBA属性的值为100。

当确定的透明程度为预设的透明程度时，设置待处理网页元素的背景属性指示背景色为白色，在背景属性中添加RGBA属性，设置RGBA属性的值为指示预设的透明程度的属性值。在本发明实施例中，优选设置预设的透明程度为全透明的一半透明程度。例如，若表示透明程度的数值区间为[0,100]，可以设置预设的透明程度为40或50等，优选地设置预设的透明程度为50，则设置RGBA属性的值为50。

另外，当待处理网页元素具有背景图片时，还需要根据背景图片类型对待处理网页元素的背景图片进行处理。当待处理网页元素的背景图片类型为渐变颜色类型时，删除其背景属性中的背景图属性，设置其背景属性指示背景色为白色，并设置其背景属性的RGBA属性的值为指示预设的透明程度的属性值。当待处理网页元素的背景图片类型为内容图类型或纹理图类型时，不再对待处理网页元素的背景图片进行处理。因为渐变颜色类型的背景图片一般不具有实质意义，而内容图类型或纹理图类型的背景图片一般包含实质含义，如一些内容图类型的背景图片可能包含广告信息等。

在本发明实施例中对网页中的网页元素进行识别并筛选出待处理网页元素，待处理网页元素进行半透明化处理之后并不影响用户浏览这些待处理网页元素的内容。而对于网页中除待处理网页元素以外的其它网页元素，若进行半透明化处理，将影响对这些网页元素的内容的浏览。例如，对于网页中包含的视频等网页元素就不适合进行半透明化处理。仅对待处理网页元素进行半透明化处理，可以使网页的半透明化处理的效果可控，降低异常效果的发生概率。

通过步骤102的操作对待处理网页元素进行半透明化处理之后，在后续显示网页时，用户可以透过待处理网页元素看到完整显示的网页皮肤。但是待处理网页元素中的文本或线条的颜色可能会与网页皮肤的颜色非常相近，导致无法看清显示的待处理网页元素，因此还需要对与网页皮肤的颜色相近的待处理网页元素进行进一步处理，以使待处理网页元素的颜色能与网页皮肤的颜色明显区分开来。

由于网页皮肤可能有多种颜色，为了提高处理效率，可以先获取网页皮肤的主题颜色，主题颜色为网页皮肤的主要颜色，即网页皮肤的大部分区域的颜色都为主题颜色。然后获取每个待处理网页元素的颜色属性，检测每个待处理网页元素的颜色，当检测到一待处理网页元素的颜色的色相值与主题颜色的色相值之差小于预设阈值时，将待处理网页元素的颜色修改为主题颜色对应的预设颜色。主题颜色对应的预设颜色可以为在色相环上与主题颜色相差预设距离的颜色。例如，可以将待处理网页元素的颜色修改为主题颜色的对比色，主题颜色的对比色为色相环上与主题颜色距离最远的颜色。假设网页皮肤的主题颜色为深绿色，待处理网页元素的颜色为浅绿色，浅绿色与深绿色的色相值之差小于预设阈值，则可以将待处理网页元素的颜色修改为红色。

上述将待处理网页元素的颜色修改为主题颜色对应的预设颜色后，待处理网页元素的颜色的色相值与主题颜色的色相值之差大于或等于预设阈值，使待处理网页元素与网页皮肤的主题颜色明显区别开来。例如，假设待处理网页元素为按钮“登录”，按钮“登录”的边框线条及字体颜色均为黑色，而在该待处理网页元素的显示区域内网页皮肤的颜色也为黑色，造成无法看清该待处理网页元素的内容，所以将按钮“登录”的边框线条及字体的颜色均修改为白色，如图1B所示，以使用户能够看清该按钮“登录”的内容。

但是由于网页皮肤可以包含多种颜色，在网页的不同位置处网页皮肤的颜色可能不同，为了更精确的处理待处理网页元素，以避免无法看清颜色与网页皮肤的颜色相近的待处理网页元素的情况，可以根据待处理网页元素的显示区域处的网页皮肤的颜色来对待处理网页元素进行处理。获取待处理网页元素的显示区域内网页皮肤的颜色的色相值，以及获取该待处理网页元素的颜色的色相值，判断在待处理网页元素的显示区域内，待处理网页元素的颜色与网页皮肤颜色的色相值之差是否小于预设阈值。若是，则修改待处理网页元素的颜色，以使其颜色与其显示区域内的网页皮肤的颜色的色相值大于预设阈值。

上述两种处理方式中，第一种方式相对简单，判断是否对网页元素的文本或线条进行处理时，仅是将每个网页元素的文本或线条的颜色与网页皮肤的主题颜色进行对比，因此对于系统资源的耗费较低，但相对的处理效果也有一定局限性，网页皮肤可能存在部分与主题颜色偏差较大的显示区域，该显示区域的网页元素的处理效果可能并不会很好。因此，第一种方式适用于网页皮肤色彩较为单一，或对系统资源耗费有一定要求的应用场景。

第二种方式相对复杂，判断是否对网页元素的文本或线条进行处理时，需要将每个网页元素的文本或线条的颜色与其显示区域内的网页皮肤的颜色进行对比，由于需要获取每个网页元素显示区域的网页皮肤颜色进行精细化对比，因此对于系统资源的耗费较高，但相对的处理效果也更好。因此，第二种方式适用于网页皮肤色彩较为丰富，或对系统资源耗费要求不高的应用场景。

步骤103：显示经半透明化处理后的每个网页元素。

对待处理网页元素进行半透明化处理后，根据处理后的网页元素的源代码，渲染并显示经半透明化处理后的每个网页元素。

为了更形象地表达本发明显示网页皮肤的效果，下面结合附图进行说明。如图1C所示，若不对网页的待处理网页元素进行半透明化处理，则显示的网页皮肤的大部分都被网页的内容区域遮挡了。而如图1D所示，对网页的待处理网页元素进行半透明化处理之后，透过半透明的内容区域，可以完整的显示出网页的网页皮肤。

在本发明中，对待处理网页元素进行半透明化处理，避免了待处理网页元素对网页皮肤的遮挡作用，透过半透明化处理的待处理网页元素可以看到完整显示的网页皮肤。另外，根据网页皮肤的颜色对待处理网页元素的颜色进行调整，可以避免网页皮肤的颜色影响待处理网页元素的内容的显示。如此处理后的网页可以在保证网页内容完整清晰显示的前提下将网页皮肤完整的显示出来，在不影响用户浏览网页内容的同时满足用户对网页皮肤的个性化需求。

在本发明实施例提供的方法中，根据每个待处理网页元素的类型和背景属性，分别对每个待处理网页元素进行半透明化处理，然后显示经半透明化处理后的每个网页元素。如此透过半透明化处理的网页元素能够看到完整的网页皮肤，避免了网页内容区域对网页皮肤的遮挡，使显示的网页层次感强，大大改善了网页皮肤的显示效果。

实施例2

参见图2，本发明实施例提供了一种网页皮肤半透明化显示的装置，该装置用于执行上述网页皮肤半透明化显示的方法。该装置具体包括：识别模块201、半透明化模块202和显示模块203。

上述识别模块201，用于识别网页中类型为预设类型的网页元素作为待处理网页元素；

上述识别模块201根据标签类型来进行识别待处理网页元素，上述预设类型可以为预先设置的标题类型、页脚类型、具体内容类型和分区类型等标签类型。识别模块201可以通过如下第一识别单元的操作来识别待处理网页元素，具体包括：

第一识别单元从网页的源代码的起始处开始遍历源代码包括的网页元素，获取遍历到的网页元素的开标签字符串，根据网页元素的开标签字符串确定遍历到的网页元素的标签类型，将网页元素的标签类型与预设类型进行比较，若网页元素的标签类型符合预设类型，则识别该网页元素作为待处理网页元素。

上述第一识别单元根据遍历到的网页元素的标签类型识别类型为预设类型的网页元素作为待处理网页元素，后续对待处理网页元素进行半透明化处理，以避免这些待处理网页元素遮挡网页皮肤的显示，实现网页皮肤的完整显示。

但是由于网页的源代码一般包含很多行代码，第一识别单元从源代码的起始处开始遍历源代码包括的网页元素，需要花费很长时间才能完成对整个网页的源代码的处理，效率比较低。因此为了缩短识别待处理网页元素的时间，提高半透明化处理的效率，识别模块201还可以通过如下第二识别单元的操作来识别待处理网页元素，具体包括：

第二识别单元根据预设的分段字符串将源代码划分为多个代码段，并行遍历多个代码段包括的网页元素，分别识别多个代码段包括的类型为预设类型的网页元素作为待处理网页元素。

另外，可以通过预设的分段字符串来控制对源代码进行分段得到的代码段的数目，代码段数目越多，后续第二识别单元并行识别多个代码段中包括的待处理网页元素的效率越高。

半透明化处理模块202，用于根据每个待处理网页元素的类型和背景属性，分别对每个待处理网页元素进行半透明化处理；

上述待处理网页元素的背景属性包括待处理网页元素的背景色属性及背景图属性。背景色属性的属性值用于指示网页元素是否具有背景色以及背景色的色调，背景图属性的属性值用于指示网页元素是否具有背景图片以及背景图片的类型，背景图片的类型可以为渐变颜色类型、内容图类型和纹理图类型。

事先对待处理网页元素的类型和背景属性进行分类。第一类可以为以下中的任意一种：待处理网页元素的类型为主体类型、待处理网页元素的类型为具体内容类型且无背景色、待处理网页元素的类型为具体内容类型且背景色为白色。第二类可以为以下中的任意一种：待处理网页元素的类型为标题或页脚类型且无背景色、待处理网页元素的类型为具体内容类型且有非白色的背景色。可以根据具体的处理需求来设置第一类和第二类，第一类和第二类中包含的类型及背景属性的情形并不限定于本发明实施例所列的情形。而且上述具体内容类型也不限定于文本、图片或超链接等标签，对于一些嵌套了包含具体内容的标签的类型也可以为具体内容类型。例如，分区标签<div id＝“nav”><a href＝href＝"http://game.com">游戏</a></div>中嵌套了超链接标签<a href＝href＝"http://game.com">游戏</a>，则该分区标签的类型可以为具体内容类型。

上述半透明化处理模块202可以通过如下确定单元和设置单元的操作来对待处理网页元素进行半透明化处理。

确定单元根据待处理网页元素的类型及背景属性，确定待处理网页元素对应的透明程度。

确定单元根据待处理网页元素的类型及背景属性的不同，又可以分别通过如下第一确定子单元、第二确定子单元和第三确定子单元来确定待处理网页元素的透明程度。

第一确定子单元，用于当待处理网页元素的类型及背景属性为第一类时，确定待处理网页元素的透明程度为全透明。具体地，当待处理网页元素为主体标签<body>时，确定待处理网页元素的类型为主体类型，确定待处理网页元素属于上述第一类。当待处理网页元素的标签为文本、图片或超链接等具有具体内容的标签时，确定待处理网页元素的类型为具体内容类型，然后获取待处理网页元素的背景色属性的属性值，若其背景色属性的属性值指示为无背景色或指示为背景色为白色，则确定待处理网页元素属于上述第一类。将属于第一类的待处理网页元素的透明程度确定为全透明。

第二确定子单元，用于当待处理网页元素的类型及背景属性为第二类时，确定待处理网页元素对应的透明程度为半透明。具体地，当待处理网页元素的标签为标题标签<header>时，确定待处理网页元素的类型为标题类型，当待处理网页元素的标签为页脚标签<footer>时，确定待处理网页元素的类型为页脚类型，在确定待处理网页元素的类型为标题类型或页脚类型时，获取待处理网页元素的背景色属性的属性值，若其背景色属性的属性值指示为无背景色，则确定待处理网页元素属于第二类。或者，当待处理网页元素的标签为文本、图片或超链接等具有具体内容的标签时，确定待处理网页元素的类型为具体内容类型，然后获取待处理网页元素的背景色属性的属性值，若其背景色属性的属性值指示为背景色为非白色，则确定待处理网页元素属于上述第二类。将属于第二类的待处理网页元素的透明程度确定为预设的透明程度。

透明程度可以通过数值来进行量化。例如，可以通过[0,100]的数值区间来量化透明程度，0表示透明程度为不透明，100表示透明程度为全透明，而数值0至100之间的数值表示不同程度的半透明。

通过上述确定单元确定待处理网页元素的透明程度之后，半透明化模块202通过如下设置单元的操作为待处理网页元素设置指示其透明程度的属性值。

设置单元根据确定单元确定的透明程度，为待处理网页元素设置指示透明程度的属性值。

具体地设置单元通过如下第一设置子单元、第二设置子单元和第三设置子单元的操作来为待处理网页元素设置指示透明程度的属性值。

第一设置子单元，用于当确定的透明程度为全透明时，在待处理网页元素的背景属性中添加色彩空间RGBA属性，设置RGBA属性的值为指示全透明的属性值，例如，若表示透明程度的数值区间为[0,100]，则设置RGBA属性的值为100；第二设置子单元，用于当确定的透明程度为预设的透明程度时，设置背景属性指示背景色为白色，在背景属性中添加RGBA属性，设置RGBA属性的值为指示预设的透明程度的属性值。在本发明实施例中，优选设置预设的透明程度为全透明的一半透明程度。例如，若表示透明程度的数值区间为[0,100]，则可以设置预设的透明程度为40或50等，优选设置预设的透明程度为50，则设置RGBA属性的值为50。

另外，当待处理网页元素具有背景图片时，上述设置单元还需要根据背景图片类型对待处理网页元素的背景图片进行处理。设置单元还用于当待处理网页元素的背景图片类型为渐变颜色类型时，删除其背景属性中的背景图属性，设置其背景属性指示背景色为白色，并设置其背景属性的RGBA属性的值为指示预设的透明程度的属性值。而当待处理网页元素的背景图片类型为内容图类型或纹理图类型时，设置单元不再对待处理网页元素的背景图片进行处理。因为渐变颜色类型的背景图片一般不具有实质意义，而内容图类型或纹理图类型的背景图片一般包含实质含义，如一些内容图类型的背景图片可能包含广告信息等。

上述半透明化模块202对待处理网页元素进行半透明化处理之后，在后续显示网页时，用户可以透过待处理网页元素看到完整显示的网页皮肤。但是待处理网页元素中的文本或线条的颜色可能会与网页皮肤的颜色非常相近，导致无法看清显示的待处理网页元素，因此还需要通过如下第一修改模块或第二修改模块来对与网页皮肤的颜色相近的待处理网页元素进行进一步处理，以使待处理网页元素的颜色能与网页皮肤的颜色明显区分开来。

由于网页皮肤可以包含多种颜色，在网页的不同位置处网页皮肤的颜色可能不同，为了更精确的处理待处理网页元素，以避免无法看清颜色与网页皮肤的颜色相近的待处理网页元素的情况，可以通过第一修改模块，判断在待处理网页元素的显示区域内，待处理网页元素的颜色与网页皮肤颜色的色相值之差是否小于预设阈值；若是，则修改待处理网页元素的颜色，待处理网页元素的修改后的颜色与其显示区域内的网页皮肤的颜色的色相值大于预设阈值。

对于网页皮肤颜色相对比较单一的情况，可以根据网页皮肤的主题颜色处理网页元素。该第二修改模块，用于获取网页的网页皮肤的主题颜色；检测每个待处理网页元素的颜色，当检测到一待处理网页元素的颜色的色相值与主题颜色的色相值之差小于预设阈值时，将待处理网页元素的颜色修改为主题颜色对应的预设颜色。

由于网页皮肤可能有多种颜色，第二修改模块仅根据网页皮肤的主题颜色来进行处理，可以节省处理时间，提高处理效率。

通过上述半透明化模块202对待处理网页元素进行半透明化处理，以及通过第一修改模块或第二修改模块根据网页皮肤的颜色对待处理网页元素的颜色进行调整之后，可以通过显示模块203显示经半透明化处理模块处理后的每个网页元素。

在本发明中，半透明化模块202对待处理网页元素进行半透明化处理，避免了待处理网页元素对网页皮肤的遮挡作用，透过半透明化处理的待处理网页元素可以看到完整显示的网页皮肤。另外，第一修改模块或第二修改模块根据网页皮肤的颜色对待处理网页元素的颜色进行调整，可以避免网页皮肤的颜色影响待处理网页元素的内容的显示。如此处理后的网页可以在保证网页内容完整清晰显示的前提下将网页皮肤完整的显示出来，在不影响用户浏览网页内容的同时满足用户对网页皮肤的个性化需求。

在本发明实施例提供的装置中，半透明化模块根据每个待处理网页元素的类型和背景属性，分别对每个待处理网页元素进行半透明化处理，然后显示模块显示经半透明化处理后的每个网页元素。如此透过半透明化处理的网页元素能够看到完整的网页皮肤，避免了网页内容区域对网页皮肤的遮挡，使显示的网页层次感强，大大改善了网页皮肤的显示效果。

本发明实施例所提供的网页皮肤半透明化显示的装置可以为设备上的特定硬件或者安装于设备上的软件或固件等。所属领域的技术人员可以清楚地了解到，为描述的方便和简洁，前述描述的模块、装置和单元的具体工作过程，均可以参考上述方法实施例中的对应过程。

在本申请所提供的几个实施例中，应该理解到，所揭露装置和方法，可以通过其它的方式实现。以上所描述的装置实施例仅仅是示意性的，例如，所述单元的划分，仅仅为一种逻辑功能划分，实际实现时可以有另外的划分方式，又例如，多个单元或组件可以结合或者可以集成到另一个系统，或一些特征可以忽略，或不执行。另一点，所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些通信接口，装置或单元的间接耦合或通信连接，可以是电性，机械或其它的形式。

所述作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。

另外，在本发明各个实施例中的各功能单元可以集成在一个处理单元中，也可以是各个单元单独物理存在，也可以两个或两个以上单元集成在一个单元中。

所述功能如果以软件功能单元的形式实现并作为独立的产品销售或使用时，可以存储在一个计算机可读取存储介质中。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质中，包括若干指令用以使得一台计算机设备(可以是个人计算机，服务器，或者网络设备等)执行本发明各个实施例所述方法的全部或部分步骤。而前述的存储介质包括：U盘、移动硬盘、只读存储器(ROM，Read-Only Memory)、随机存取存储器(RAM，Random Access Memory)、磁碟或者光盘等各种可以存储程序代码的介质。

以上所述，仅为本发明的具体实施方式，但本发明的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本发明揭露的技术范围内，可轻易想到变化或替换，都应涵盖在本发明的保护范围之内。因此，本发明的保护范围应所述以权利要求的保护范围为准。

Claims (16)

1.一种网页皮肤半透明化显示的方法，所述网页中设置有网页皮肤，其特征在于，所述方法包括：

识别所述网页中类型为预设类型的网页元素作为待处理网页元素；

根据每个所述待处理网页元素的类型和背景属性，分别对每个所述待处理网页元素进行半透明化处理；

显示经半透明化处理后的每个网页元素。

2.根据权利要求1所述的方法，其特征在于，所述根据每个所述待处理网页元素的类型和背景属性，分别对每个所述待处理网页元素进行半透明化处理，包括：

根据待处理网页元素的类型及背景属性，确定所述待处理网页元素对应的透明程度；

根据确定的所述透明程度，为所述待处理网页元素设置指示所述透明程度的属性值。

3.根据权利要求1所述的方法，其特征在于，所述方法还包括：

判断在所述待处理网页元素的显示区域内，所述待处理网页元素的颜色与网页皮肤颜色的色相值之差是否小于预设阈值；

若是，则修改所述待处理网页元素的颜色，所述待处理网页元素的修改后的颜色与其显示区域内的网页皮肤的颜色的色相值大于所述预设阈值。

4.根据权利要求1所述的方法，其特征在于，所述方法还包括：

获取所述网页的网页皮肤的主题颜色；

检测每个所述待处理网页元素的颜色，当检测到一待处理网页元素的颜色的色相值与所述主题颜色的色相值之差小于预设阈值时，将所述待处理网页元素的颜色修改为所述主题颜色对应的预设颜色。

5.根据权利要求2所述的方法，其特征在于，所述根据待处理网页元素的类型及背景属性，确定所述待处理网页元素对应的透明程度，包括：

当待处理网页元素的类型及背景属性为第一类时，确定所述待处理网页元素的透明程度为全透明，所述第一类为以下中的任意一种：所述待处理网页元素的类型为主体类型、所述待处理网页元素的类型为具体内容类型且无背景色、所述待处理网页元素的类型为具体内容类型且背景色为白色；

当所述待处理网页元素的类型及背景属性为第二类时，确定所述待处理网页元素对应的透明程度为预设的透明程度，所述第二类为以下中的任意一种：所述待处理网页元素的类型为标题或页脚类型且无背景色、所述待处理网页元素的类型为具体内容类型且有非白色的背景色。

6.根据权利要求2或5所述的方法，其特征在于，所述根据确定的所述透明程度，为所述待处理网页元素设置指示所述透明程度的属性值，包括：

当确定的所述透明程度为全透明时，在所述待处理网页元素的背景属性中添加色彩空间RGBA属性，设置所述RGBA属性的值为指示所述全透明的属性值；

当确定的所述透明程度为预设的透明程度时，设置所述背景属性指示背景色为白色，在所述背景属性中添加RGBA属性，设置所述RGBA属性的值为指示所述预设的透明程度的属性值。

7.根据权利要求6所述的方法，其特征在于，所述方法还包括：

当所述待处理网页元素的背景图片类型为渐变颜色类型时，删除其背景属性中的背景图属性，设置其背景属性指示背景色为白色，并设置其背景属性的RGBA属性的值为指示所述预设的透明程度的属性值。

8.根据权利要求1所述的方法，其特征在于，所述识别所述网页中类型为预设类型的网页元素作为待处理网页元素，包括：

从所述网页的源代码的起始处开始遍历所述源代码包括的网页元素；根据遍历到的所述网页元素的标签类型，识别类型为预设类型的网页元素作为待处理网页元素；或者，

根据预设的分段字符串将所述源代码划分为多个代码段，并行遍历所述多个代码段包括的网页元素，分别识别所述多个代码段包括的类型为预设类型的网页元素作为待处理网页元素。

9.一种网页皮肤半透明化显示的装置，所述网页中设置有网页皮肤，其特征在于，所述装置包括：

识别模块，用于识别所述网页中类型为预设类型的网页元素作为待处理网页元素；

半透明化处理模块，用于根据每个所述待处理网页元素的类型和背景属性，分别对每个所述待处理网页元素进行半透明化处理；

显示模块，用于显示经所述半透明化处理模块处理后的每个网页元素。

10.根据权利要求9所述的装置，其特征在于，所述半透明化处理模块包括：

确定单元，用于根据待处理网页元素的类型及背景属性，确定所述待处理网页元素对应的透明程度；

设置单元，用于根据所述确定单元确定的所述透明程度，为所述待处理网页元素设置指示所述透明程度的属性值。

11.根据权利要求9所述的装置，其特征在于，所述装置还包括：

第一修改模块，用于判断在所述待处理网页元素的显示区域内，所述待处理网页元素的颜色与网页皮肤颜色的色相值之差是否小于预设阈值；若是，则修改所述待处理网页元素的颜色，所述待处理网页元素的修改后的颜色与其显示区域内的网页皮肤的颜色的色相值大于所述预设阈值。

12.根据权利要求9所述的装置，其特征在于，所述装置还包括：

第二修改模块，用于获取所述网页的网页皮肤的主题颜色；检测每个所述待处理网页元素的颜色，当检测到一待处理网页元素的颜色的色相值与所述主题颜色的色相值之差小于预设阈值时，将所述待处理网页元素的颜色修改为所述主题颜色对应的预设颜色。

13.根据权利要求10所述的装置，其特征在于，所述确定单元包括：

第一确定子单元，用于当待处理网页元素的类型及背景属性为第一类时，确定所述待处理网页元素的透明程度为全透明，所述第一类为以下中的任意一种：所述待处理网页元素的类型为主体类型、所述待处理网页元素的类型为具体内容类型且无背景色、所述待处理网页元素的类型为具体内容类型且背景色为白色；

第二确定子单元，用于当所述待处理网页元素的类型及背景属性为第二类时，确定所述待处理网页元素对应的透明程度为预设的透明程度，所述第二类为以下中的任意一种：所述待处理网页元素的类型为标题或页脚类型且无背景色、所述待处理网页元素的类型为具体内容类型且有非白色的背景色。

14.根据权利要求10或13所述的装置，其特征在于，所述设置单元包括：

第一设置子单元，用于当确定的所述透明程度为全透明时，在所述待处理网页元素的背景属性中添加色彩空间RGBA属性，设置所述RGBA属性的值为指示所述全透明的属性值；

第二设置子单元，用于当确定的所述透明程度为预设的透明程度时，设置所述背景属性指示背景色为白色，在所述背景属性中添加RGBA属性，设置所述RGBA属性的值为指示所述预设的透明程度的属性值。

15.根据权利要求14所述的装置，其特征在于，所述设置单元，还用于当所述待处理网页元素的背景图片类型为渐变颜色类型时，删除其背景属性中的背景图属性，设置其背景属性指示背景色为白色，并设置其背景属性的RGBA属性的值为指示所述预设的透明程度的属性值。

16.根据权利要求9所述的装置，其特征在于，所述识别模块包括：

第一识别单元，用于从所述网页的源代码的起始处开始遍历所述源代码包括的网页元素；根据遍历到的所述网页元素的标签类型，识别类型为预设类型的网页元素作为待处理网页元素；或者，

第二识别单元，用于根据预设的分段字符串将所述源代码划分为多个代码段，并行遍历所述多个代码段包括的网页元素，分别识别所述多个代码段包括的类型为预设类型的网页元素作为待处理网页元素。