CN106202422A - 网页图标的处理方法和装置 - Google Patents

Abstract

本发明实施例公开了一种网页图标的处理方法和装置。本发明实施例方法包括：对待检测文件中是否包含目标样式名进行检测，其中，所述目标样式名为具有预置形式的样式名；当所述待检测文件中检测到所述目标样式名时，根据所述目标样式名在可缩放矢量图形SVG文件库中查找到目标SVG，所述目标SVG为命名与所述目标样式名满足预置关系的SVG；将查找到的所述目标SVG打包转换为字体文件，其中，所述字体文件记录有所述目标SVG对应的字体编码；根据所述字体文件生成所述目标样式名对应的样式内容，所述目标样式名的样式内容包括：引入所述目标SVG对应的字体编码。

Description

网页图标的处理方法和装置

技术领域

本发明涉及计算机技术领域，特别是一种网页图标的处理方法和装置。

背景技术

网页(英文名称：Web)页面的内容包含文字、流媒体和图片等信息，其中图片包括被背景图、插图和图标等等。然而，Web页面在一些情况下的内容需要做一些变动，例如Web中的图标的大小颜色等等需要改动。现有技术中图标一般采用可缩放矢量图形(英文：Scalable Vector Graphics，缩写：SVG)图片，该种方案可以很好解决图片大小的问题，但是该方案的兼容性较差，例如不兼容IE6-8和Android 2.3。

针对上述问题，一种解决方案是将SVG图片制作成字体，在文件中需要用到图标的地方采用该字体来替代SVG图片，可以解决兼容性的问题，而且由于字体是矢量的，可以随意改变大小。然而，现有技术中，将文件中需要用到的SVG图片转换为字体的这个过程需要由代码开发人员手动的进行SVG的转换，并且在页面使用字体时也需要开发人员手动的写入到页面文件中，导致效率低下。

发明内容

本发明实施例提供了一种网页图标的处理方法和装置，能够提高将页面中的SVG转换为字体的效率。

第一方面，本发明提供一种网页图标的处理方法，包括：

对待检测文件中是否包含目标样式名进行检测，其中，所述目标样式名为具有预置形式的样式名；

当所述待检测文件中检测到所述目标样式名时，根据所述目标样式名在可缩放矢量图形SVG文件库中查找到目标SVG，所述目标SVG为命名与所述目标样式名满足预置关系的SVG；

将查找到的所述目标SVG打包转换为字体文件，其中，所述字体文件记录有所述目标SVG对应的字体编码；

根据所述字体文件生成所述目标样式名对应的样式内容，所述目标样式名的样式内容包括：引入所述目标SVG对应的字体编码。

第二方面，本发明提供一种网页图标的处理装置，包括：

检测模块，用于对待检测文件中是否包含目标样式名进行检测，其中，所述目标样式名为具有预置形式的样式名；

查找模块，用于当所述待检测文件中检测到所述目标样式名时，根据所述目标样式名在可缩放矢量图形SVG文件库中查找到目标SVG，所述目标SVG为命名与所述目标样式名满足预置关系的SVG；

转换模块，用于将查找到的所述目标SVG打包转换为字体文件，其中，所述字体文件记录有所述目标SVG对应的字体编码；

生成模块，用于根据所述字体文件生成所述目标样式名对应的样式内容，所述目标样式名的样式内容包括：引入所述目标SVG对应的字体编码。

从以上技术方案可以看出，本发明实施例具有以下优点：

本发明中，当检测到待检测文件包含目标样式名时，即可确定该待测文件中需要引入图标为命名与目标样式名满足预置关系的SVG(称为目标SVG)，将在SVG文件库中查找到的目标SVG打包转换为文件字体，并根据该文件字体目标样式名的样式内容。这样，在显示待检测文件的页面时可以根据该文件所包含的目标样式名对应的样式内容在该页面中自动引入目标SVG对应的字体，整个过程无需人工参与，提高将页面中的SVG转换为字体的效率。

附图说明

图1为本发明的网页图标的处理方法的一个实施例的流程示意图；

图2为本发明的网页图标的处理装置的一个实施例的结构示意图；

图3为本发明的网页图标的处理装置的另一个实施例的结构示意图；

图4为本发明的终端的一个实施例的结构示意图。

具体实施方式

请参阅图1，图1为本发明的网页图标的处理方法的一个实施例的流程示意图。本实施例中，网页图标的处理方法包括：

101、对待检测文件中是否包含目标样式名进行检测，其中，所述目标样式名为具有预置形式的样式名。

本实施例中，待检测文件指的需要将其内容中的SVG图片转换为字体的文件。确定待检测文件的方法有多种。例如，将一个前端项目中的至少部分代码文件作为待检测文件，其中，该前端项目可以是采用前端集成解决方案(英文：Front-end Integrated Solution，缩写：FIS)、GLUP、webpack、grunt或者其他前端构建工具构建的，在此不作限制。

具体举例来说，待检测文件为采用FIS构建的工程中项目根目录下的所有以超级文本标记语言(英文：Hyper Text Markup Language，缩写：html)、tpl、js为后缀的文件，或者还包括以ejs为后缀的文件。

本实施例中，获取待检测文件的方法有多种。例如，对FIS构建的工程中的项目文件，遍历每一层目录，由于需要引用字体图标的文件一般为以html、tpl、js为后缀的文件，因此将每一个目录下的所有以html、tpl、js为后缀的文件的路径存储到一个列表中，将该列表中的全部文件作为所述待检测文件。可选的，在确定部分文件中的内容中不包括字体图标时，还可以从列表中剔除这类型文件，这样可以提高处理速度。

又例如，在建立列表时，对FIS构建的工程中的项目文件，第一次遍历每一层目录时，仅搜索所有以html为后缀的文件，第二次遍历每一层目录时，仅搜索所有以tpl为后缀的文件，第三次遍历每一层目录时，仅搜索所有以js为后缀的文件，当然，上述所述遍历排序仅为举例，并不做限制。这样，在遍历每一种后缀的文件时，由于部分目录下可以确定不存在该后缀的文件要引用字体图标的，这样在遍历时可以省略这些目录不进行搜索，加快遍历的速度。具体举例来说，在对以js为后缀的文件进行遍历时，由于基础库中以js为后缀的文件一般不需要引入字体图标，因此在遍历时可以忽略掉基础库。

本实施例中，具有预置形式的样式名可以有多种。举例来说，目标样式名为具有预置前缀(例如i-、a-等等)的样式名。例如，目标样式名为i-close。又例如，目标为具有预置后缀(例如-i、-a等等)的样式名，其中，所述预置形式可以采用默认设置，也可以在对待检测文件检测之前对该所述预置形式进行定义，在此不作限制。

102、当所述待检测文件中检测到所述目标样式名时，根据所述目标样式名在可缩放矢量图形SVG文件库中查找到目标SVG，所述目标SVG为命名与所述目标样式名满足预置关系的SVG。

本实施例中，由于样式名一般写在文件的标签中，当所述待检测文件中检测到所述目标样式名时，指的是在待测文件的标签中检测到目标样式名。该目标样式名为在构建项目时被写在该待测文件的标签中的，表示该待测文件中需要将该待测文件中原为SVG图片的图标转换为字体图标。

为方便理解，下面对样式名和样式表该两个概念进行解释。样式表中包括多个样式名以及每个样式名对应的样式内容，其中每个样式内容用于定义文件中的元素所符合的一种规则。文件的标签中包括至少一个样式名，以表示该文件中的元素符合该样式名在所述样式表中所对应的样式内容。

本实施例中，目标SVG的命名与目标样式名所满足的预置关系可以有多种。举例来说，当目标样式名为具有预置前缀(例如i-、a-等等)的样式名，目标SVG的命名与目标样式名中除预置前缀部分以外的其余部分相同。例如，目标样式名为i-close，那么目标SVG的命名为close.svg。或者，当目标样式名为具有预置后缀(例如i-、a-等等)的样式名，目标SVG的命名与目标样式名中除预置后缀部分以外的其余部分相同。例如，目标样式名为close-i，那么目标SVG的命名为close.svg。其中，所述预置关系可以采用默认设置，也可以在对待检测文件检测之前对该所述预置关系进行定义，在此不作限制。

本实施例中，可缩放矢量图形SVG文件库指的是预先存放有SVG图片的目录。例如，在FIS解决方案中代码目录fis3-postpackager-iconfont下设置有SVGS文件夹，该可缩放矢量图形SVG文件库指的是该fis3-postpackager-iconfont中的SVGS文件夹。或者，可缩放矢量图形SVG文件库也可以指的是其他预先配置的存放有SVG图片的文件夹，在此不作限制。

103、将查找到的所述目标SVG打包转换为字体文件，其中，所述字体文件记录有所述目标SVG对应的字体编码。

本实施例中，将目标SVG打包转换为字体文件的方法有多种。例如，对目标SVG做base64编码，或者，可以采用font-carrier插件实现。当然，上述仅为举例，并不做限制。该字体文件记录有目标SVG对应的字体编码，以便根据该字体文件可以引用目标SVG所对应的字体编码。获取到字体文件后，可以将字体文件写入项目入口文件处，或者通过外部链接的方式引入该项目，以便项目中的待检测文件可以引入该字体文件中的字体编码。

104、根据所述字体文件生成所述目标样式名对应的样式内容，所述目标样式名的样式内容包括：引入所述目标SVG对应的字体编码。

将目标样式名的样式内容定义为引入目标SVG对应的字体编码后，这样，标签中写有目标样式名的文件中的内容依据该目标样式名的内容引入目标SVG对应的字体编码，以在该文件中显示目标SVG所转换成的字体图标。

本实施例中，生成目标样式名的样式内容的形式有多种。例如，确定目标样式名使用的伪类，并根据所述伪类生成新样式名，其中，所述伪类用于指示所述目标SVG对应的字体编码的索引；生成所述想样式名的样式内容，该样式内容包括引入所述伪类指示的字体编码。具体举例来说，样式名为i-close，那么根据伪类生成的新样式名为i-close：after。

本实施例中，当检测到待检测文件包含目标样式名时，即可确定该待测文件中需要引入图标为命名与目标样式名满足预置关系的SVG(称为目标SVG)，因此将在SVG文件库中查找到的目标SVG打包转换为文件字体，并根据该文件字体目标样式名的样式内容；这样，在显示待检测文件的页面时可以根据该文件所包含的目标样式名对应的样式内容在该页面中自动引入目标SVG对应的字体，整个过程无需人工参与，提高将页面中的SVG转换为字体的效率。而且，由于字体文件中的每一个字体编码对应到待测文件中要用到的SVG，避免了字体文件中出现一些不必要的字体编码，减小字体文件的大小。

本实施例中，步骤104中生成目标样式名对应的样式内容的方式有多种，下面对其中的两种进行举例描述。

举例一，新建层叠样式表(英文：Cascading Style Sheets，缩写：CSS)文件，在所述CSS文件中配置所述目标样式名的样式内容；并将该CSS引入待检测文件所属的网页编程语言文件中。实际应用中，待测文件可以是一个网页编程语言文件，那么待测文件所属的网页编程语言文件即待测文件本身，或者，待测文件也可以是一个网页编程语言文件的内容中引用其他文件，那么待测文件所属网页编程语言文件指的是引用待测文件的网页编程语言文件。将CSS文件引入待检测文件所属的网页编程语言文件后，该网页编程语言文件以及该网页编程语言文件的内容中所引用的其他文件中的样式名都由该CSS文件中所配置的该样式名的样式内容定义。

以网页编程语言文件为html文件举例来说，一个html文件中可能用到其他tpl文件、js文件或者其他文件，若待测文件为该html文件，那么将生成的CSS文件引入该html文件中，若待测文件为html文件中所引用的tpl文件，那么将生成的CSS文件引入该html文件中。

其中，将所述CSS文件引入所述待检测文件所属的网页编程语言文件的方法有多种。例如，以内联样式的方式或者以外链样式表的方式将所述CSS文件引入所述待检测文件所属的网页编程语言文件中。或者，采用脚本的方式将所述CSS文件加载到所述待检测文件所属的网页编程语言文件中。当然，上述仅为举例，并不做限制。

举例二，在所述待检测文件所属的网页编程语言文件中生成所述目标样式名对应的样式内容。与举例一不同的是，举例二中不需要新建CSS表，而是直接将生成的目标样式名对应的样式内容写入到待检测文件所属的网页编程语言文件中。这样，待检测文件所属的网页编程语言文件以及该网页编程语言文件的内容中引用的其他文件可以直接使用该目标样式名对应的样式内容，省略了将CSS表引入待检测文件所属的网页编程语言文件这个步骤。

为方便理解本发明，下面结合一个实际应用场景对本发明中的网页图标的处理方法进行举例描述。

本实施例中，在FIS构建的工程中加入一个插件，该插件的配置如下：

上述插件运行时，在工程的项目文件的每一层目录进行遍历，以查找所有以html、tpl、js为后缀的文件，其中，在遍历每一层目录以查找以js为后缀的文件时，采用ignore:['zepto','badjs','mod','bj-report','tools','db.js']跳过基础库，不在该基础库中查找以js为后缀的文件。查找出的所有以html、tpl、js为后缀的文件的路径添加到列表中。

对列表中的每一个文件，根据classPrefix:'i-',查找该文件的标签中是否包含前缀为'i-'的样式名。当该文件的标签中包含前缀为'i-'的样式名时，根据svgPath:'../svgs'到svgPath中查找目标SVG，所述目标SVG的命名与目标样式名中除预置前缀部分以外的其余部分相同。例如，当文件的标签中包含命名为“i-close”的样式名时，到svgPath中查找命名为close.svg的SVG。

这样，找到列表中所有文件要用到的SVG，根据base64:false将该所有SVG做base64编码，打包成一个字体文件，该字体文件中记录有每个SVG对应的字体编码。根据output:'modules/common/fonts'将字体文件放置到该目录下。

新建CSS文件，在该文件中配置列表中所有文件的标签中以'i-'为前缀的样式名，并生成每一个样式名的样式内容。根据pseClass:'before'对CSS文件中的每一个样式名增加伪类，即在每一个样式名后增加“：before”，举例来说，若加入CSS文件中的一个样式名为i-close，那么增加伪类后的样式名改为i-close：before。该伪类用于指示命名与该样式名中除预置前缀部分以外的其余部分相同的SVG对应的字体编码的索引。每个样式名的样式内容为：引入命名与该样式名中除预置前缀部分以外的其余部分相同的SVG对应的字体编码。

生成CSS文件后，根据cssInline:true采用内联样式的方式将CSS文件引入上述列表的所有html文件中。

上面对本发明的网页图标的处理方法进行了描述，下面将对本发明的网页图标的处理装置进行描述。

请参阅图2，图2为本发明的网页图标的处理装置的一个实施例的结构示意图。本实施例中，网页图标的处理装置200包括：

检测模块201，用于对待检测文件中是否包含目标样式名进行检测，其中，所述目标样式名为具有预置形式的样式名；

查找模块202，用于当所述待检测文件中检测到所述目标样式名时，根据所述目标样式名在可缩放矢量图形SVG文件库中查找到目标SVG，所述目标SVG为命名与所述目标样式名满足预置关系的SVG；

转换模块203，用于将查找到的所述目标SVG打包转换为字体文件，其中，所述字体文件记录有所述目标SVG对应的字体编码；

生成模块204，用于根据所述字体文件生成所述目标样式名对应的样式内容，所述目标样式名的样式内容包括：引入所述目标SVG对应的字体编码。

本实施例中，网页图标的处理装置在检测到待检测文件包含目标样式名时，即可确定该待测文件中需要引入图标为命名与目标样式名满足预置关系的SVG(称为目标SVG)，因此将在SVG文件库中查找到的目标SVG打包转换为文件字体，并根据该文件字体目标样式名的样式内容；这样，在显示待检测文件的页面时可以根据该文件所包含的目标样式名对应的样式内容在该页面中自动引入目标SVG对应的字体，整个过程无需人工参与，提高将页面中的SVG转换为字体的效率。

可选的，所述生成模块204具体用于根据所述字体文件在所述待检测文件所属的网页编程语言文件中生成所述目标样式名对应的样式内容。

可选的，所述生成模块204具体用于确定所述目标样式名使用的伪类，并根据所述伪类生成新样式名，其中，所述伪类用于指示所述目标SVG对应的字体编码的索引；生成所述新样式名对应的样式内容，所述样式内容包括：引入所述伪类指示的字体编码。

可选的，如图3所示，图3为本发明的网页图标的处理装置的另一个实施例的结构示意图。与图2不同的是，本实施例中，所述生成模块204具体用于新建层叠样式表CSS文件，在所述CSS文件中配置所述目标样式名的样式内容。且所述网页图标的处理装置300还包括引入模块301，用于将所述CSS文件引入所述待检测文件所属的网页编程语言文件中。

可选的，所述引入模块301具体用于以内联样式的方式或者以外链样式表的方式将所述CSS文件引入所述待检测文件所属的网页编程语言文件中。

本发明实施例还提供了另一种终端，如图4所示，为了便于说明，仅示出了与本发明实施例相关的部分，具体技术细节未揭示的，请参照本发明实施例方法部分。该终端可以为包括手机、平板电脑、PDA(Personal Digital Assistant，个人数字助理)、POS(Point ofSales，销售终端)、车载电脑等任意终端设备，以终端为手机为例：

图4示出的是与本发明实施例提供的终端相关的手机的部分结构的框图。参考图4，手机包括：射频(Radio Frequency，RF)电路1010、存储器1020、输入单元1030、显示单元1040、传感器1050、音频电路1060、无线保真(wireless fidelity，WiFi)模块1070、处理器1080、以及电源1090等部件。本领域技术人员可以理解，图4中示出的手机结构并不构成对手机的限定，可以包括比图示更多或更少的部件，或者组合某些部件，或者不同的部件布置。

下面结合图4对手机的各个构成部件进行具体的介绍：

RF电路1010可用于收发信息或通话过程中，信号的接收和发送，特别地，将基站的下行信息接收后，给处理器1080处理；另外，将设计上行的数据发送给基站。通常，RF电路1010包括但不限于天线、至少一个放大器、收发信机、耦合器、低噪声放大器(Low NoiseAmplifier，LNA)、双工器等。此外，RF电路1010还可以通过无线通信与网络和其他设备通信。上述无线通信可以使用任一通信标准或协议，包括但不限于全球移动通讯系统(GlobalSystem of Mobile communication，GSM)、通用分组无线服务(General Packet RadioService，GPRS)、码分多址(Code Division Multiple Access，CDMA)、宽带码分多址(Wideband Code Division Multiple Access,WCDMA)、长期演进(Long Term Evolution，LTE)、电子邮件、短消息服务(Short Messaging Service，SMS)等。

存储器1020可用于存储软件程序以及模块，处理器1080通过运行存储在存储器1020的软件程序以及模块，从而执行手机的各种功能应用以及数据处理。存储器1020可主要包括存储程序区和存储数据区，其中，存储程序区可存储操作系统、至少一个功能所需的应用程序(比如声音播放功能、图像播放功能等)等；存储数据区可存储根据手机的使用所创建的数据(比如音频数据、电话本等)等。此外，存储器1020可以包括高速随机存取存储器，还可以包括非易失性存储器，例如至少一个磁盘存储器件、闪存器件、或其他易失性固态存储器件。

输入单元1030可用于接收输入的数字或字符信息，以及产生与手机的用户设置以及功能控制有关的键信号输入。具体地，输入单元1030可包括触控面板1031以及其他输入设备1032。触控面板1031，也称为触摸屏，可收集用户在其上或附近的触摸操作(比如用户使用手指、触笔等任何适合的物体或附件在触控面板1031上或在触控面板1031附近的操作)，并根据预先设定的程式驱动相应的连接装置。可选的，触控面板1031可包括触摸检测装置和触摸控制器两个部分。其中，触摸检测装置检测用户的触摸方位，并检测触摸操作带来的信号，将信号传送给触摸控制器；触摸控制器从触摸检测装置上接收触摸信息，并将它转换成触点坐标，再送给处理器1080，并能接收处理器1080发来的命令并加以执行。此外，可以采用电阻式、电容式、红外线以及表面声波等多种类型实现触控面板1031。除了触控面板1031，输入单元1030还可以包括其他输入设备1032。具体地，其他输入设备1032可以包括但不限于物理键盘、功能键(比如音量控制按键、开关按键等)、轨迹球、鼠标、操作杆等中的一种或多种。

显示单元1040可用于显示由用户输入的信息或提供给用户的信息以及手机的各种菜单。显示单元1040可包括显示面板1041，可选的，可以采用液晶显示器(LiquidCrystal Display，LCD)、有机发光二极管(Organic Light-Emitting Diode,OLED)等形式来配置显示面板1041。进一步的，触控面板1031可覆盖显示面板1041，当触控面板1031检测到在其上或附近的触摸操作后，传送给处理器1080以确定触摸事件的类型，随后处理器1080根据触摸事件的类型在显示面板1041上提供相应的视觉输出。虽然在图4中，触控面板1031与显示面板1041是作为两个独立的部件来实现手机的输入和输入功能，但是在某些实施例中，可以将触控面板1031与显示面板1041集成而实现手机的输入和输出功能。

手机还可包括至少一种传感器1050，比如光传感器、运动传感器以及其他传感器。具体地，光传感器可包括环境光传感器及接近传感器，其中，环境光传感器可根据环境光线的明暗来调节显示面板1041的亮度，接近传感器可在手机移动到耳边时，关闭显示面板1041和/或背光。作为运动传感器的一种，加速计传感器可检测各个方向上(一般为三轴)加速度的大小，静止时可检测出重力的大小及方向，可用于识别手机姿态的应用(比如横竖屏切换、相关游戏、磁力计姿态校准)、振动识别相关功能(比如计步器、敲击)等；至于手机还可配置的陀螺仪、气压计、湿度计、温度计、红外线传感器等其他传感器，在此不再赘述。

音频电路1060、扬声器1061，传声器1062可提供用户与手机之间的音频接口。音频电路1060可将接收到的音频数据转换后的电信号，传输到扬声器1061，由扬声器1061转换为声音信号输出；另一方面，传声器1062将收集的声音信号转换为电信号，由音频电路1060接收后转换为音频数据，再将音频数据输出处理器1080处理后，经RF电路1010以发送给比如另一手机，或者将音频数据输出至存储器1020以便进一步处理。

WiFi属于短距离无线传输技术，手机通过WiFi模块1070可以帮助用户收发电子邮件、浏览网页和访问流式媒体等，它为用户提供了无线的宽带互联网访问。虽然图4示出了WiFi模块1070，但是可以理解的是，其并不属于手机的必须构成，完全可以根据需要在不改变发明的本质的范围内而省略。

处理器1080是手机的控制中心，利用各种接口和线路连接整个手机的各个部分，通过运行或执行存储在存储器1020内的软件程序和/或模块，以及调用存储在存储器1020内的数据，执行手机的各种功能和处理数据，从而对手机进行整体监控。可选的，处理器1080可包括一个或多个处理单元；优选的，处理器1080可集成应用处理器和调制解调处理器，其中，应用处理器主要处理操作系统、用户界面和应用程序等，调制解调处理器主要处理无线通信。可以理解的是，上述调制解调处理器也可以不集成到处理器1080中。

手机还包括给各个部件供电的电源1090(比如电池)，优选的，电源可以通过电源管理系统与处理器1080逻辑相连，从而通过电源管理系统实现管理充电、放电、以及功耗管理等功能。

尽管未示出，手机还可以包括摄像头、蓝牙模块等，在此不再赘述。

在本发明实施例中，该终端所包括的处理器1080还具有控制执行以上由网页图标的处理装置执行的方法流程。

所属领域的技术人员可以清楚地了解到，为描述的方便和简洁，上述描述的系统，装置和单元的具体工作过程，可以参考前述方法实施例中的对应过程，在此不再赘述。

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

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

另外，在本发明各个实施例中的各功能单元可以集成在一个处理单元中，也可以是各个单元单独物理存在，也可以两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现，也可以采用软件功能单元的形式实现。

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

以上所述，以上实施例仅用以说明本发明的技术方案，而非对其限制；尽管参照前述实施例对本发明进行了详细的说明，本领域的普通技术人员应当理解：其依然可以对前述各实施例所记载的技术方案进行修改，或者对其中部分技术特征进行等同替换；而这些修改或者替换，并不使相应技术方案的本质脱离本发明各实施例技术方案的精神和范围。

Claims (10)

1.一种网页图标的处理方法，其特征在于，包括：

对待检测文件中是否包含目标样式名进行检测，其中，所述目标样式名为具有预置形式的样式名；

当所述待检测文件中检测到所述目标样式名时，根据所述目标样式名在可缩放矢量图形SVG文件库中查找到目标SVG，所述目标SVG为命名与所述目标样式名满足预置关系的SVG；

将查找到的所述目标SVG打包转换为字体文件，其中，所述字体文件记录有所述目标SVG对应的字体编码；

根据所述字体文件生成所述目标样式名对应的样式内容，所述目标样式名的样式内容包括：引入所述目标SVG对应的字体编码。

2.根据权利要求1所述的网页图标的处理方法，其特征在于，所述根据所述字体文件生成所述目标样式名对应的样式内容，包括：

根据所述字体文件在所述待检测文件所属的网页编程语言文件中生成所述目标样式名对应的样式内容。

3.根据权利要求1所述的网页图标的处理方法，其特征在于，所述在预置文件中生成所述目标样式名的样式内容，包括：

新建层叠样式表CSS文件，在所述CSS文件中配置所述目标样式名的样式内容；

所述方法还包括：

将所述CSS文件引入所述待检测文件所属的网页编程语言文件中。

4.根据权利要求3所述的网页图标的处理方法，其特征在于，所述将所述CSS文件引入所述待检测文件所属的网页编程语言文件中，包括：

以内联样式的方式或者以外链样式表的方式将所述CSS文件引入所述待检测文件所属的网页编程语言文件中。

5.根据权利要求1至4任一项所述的网页图标的处理方法，其特征在于，所述根据所述字体文件生成所述目标样式名的样式内容，包括：

确定所述目标样式名使用的伪类，并根据所述伪类生成新样式名，其中，所述伪类用于指示所述目标SVG对应的字体编码的索引；

生成所述新样式名对应的样式内容，所述样式内容包括：引入所述伪类指示的字体编码。

6.一种网页图标的处理装置，其特征在于，包括：

检测模块，用于对待检测文件中是否包含目标样式名进行检测，其中，所述目标样式名为具有预置形式的样式名；

查找模块，用于当所述待检测文件中检测到所述目标样式名时，根据所述目标样式名在可缩放矢量图形SVG文件库中查找到目标SVG，所述目标SVG为命名与所述目标样式名满足预置关系的SVG；

转换模块，用于将查找到的所述目标SVG打包转换为字体文件，其中，所述字体文件记录有所述目标SVG对应的字体编码；

生成模块，用于根据所述字体文件生成所述目标样式名对应的样式内容，所述目标样式名的样式内容包括：引入所述目标SVG对应的字体编码。

7.根据权利要求6所述的网页图标的处理装置，其特征在于，所述生成模块具体用于根据所述字体文件在所述待检测文件所属的网页编程语言文件中生成所述目标样式名对应的样式内容。

8.根据权利要求6所述的网页图标的处理装置，其特征在于，所述生成模块具体用于新建层叠样式表CSS文件，在所述CSS文件中配置所述目标样式名的样式内容；

所述网页图标的处理装置还包括：

引入模块，用于将所述CSS文件引入所述待检测文件所属的网页编程语言文件中。

9.根据权利要求8所述的网页图标的处理装置，其特征在于，所述引入模块具体用于以内联样式的方式或者以外链样式表的方式将所述CSS文件引入所述待检测文件所属的网页编程语言文件中。

10.根据权利要求6至9任一项所述的网页图标的处理装置，其特征在于，所述生成模块具体用于确定所述目标样式名使用的伪类，并根据所述伪类生成新样式名，其中，所述伪类用于指示所述目标SVG对应的字体编码的索引；生成所述新样式名对应的样式内容，所述样式内容包括：引入所述伪类指示的字体编码。