CN106168959A - 网页布局方法及装置 - Google Patents

Abstract

本发明涉及一种网页布局方法及装置。该方法包括：获取浏览器的当前窗口大小；计算浏览器的当前窗口大小与第一预设值的第一比值；将第一比值与基准值的乘积确定为网页的根元素的字体大小的当前值；根据当前值以及网页的各个元素相对于网页的根元素的字体大小的倍数，确定网页的各个元素的大小；根据确定的网页的各个元素的大小显示网页。本发明通过预先将网页的各个元素的大小设置为网页的根元素的字体大小的倍数，在客户端进行网页布局时，只需根据浏览器的当前窗口大小调整网页的根元素的字体大小，而无需分别调整网页的每个元素的大小，能够减少网页布局中为兼容各种客户端、各种浏览器产生的工作量，提高网页布局效率，并降低网页加载时间。

Description

网页布局方法及装置

技术领域

本发明涉及信息技术领域，尤其涉及一种网页布局方法及装置。

背景技术

原生App(Application，应用)针对iOS、Android和Windows等不同的操作系统要采用不同的语言和框架进行开发。相对于原生App，HTML(HyperText Markup Language，超文本标记语言)5页面具有传播性强、开发简单以及快速上线、无需在客户端升级等优点，非常适合轻量级App和推广页面。

为了使网页能够兼容各种终端设备，而不是为每种终端设备分别设计特定的版本，Ethan Marcotte在2010年5月提出了响应式布局的概念。现有的响应式布局技术是通过Media Queries(媒体查询)获取终端设备的尺寸，再根据终端设备的尺寸调整网页中的每个元素的尺寸。这种响应式布局技术为了兼容各种终端设备而产生的工作量较大、效率较低下且网页的加载时间较长。

发明内容

技术问题

有鉴于此，本发明要解决的技术问题是，现有的网页布局技术在兼容各种终端设备时由于要调整每个元素的尺寸而产生的工作量较大、效率较低下且网页的加载时间较长。

解决方案

为了解决上述技术问题，根据本发明的一实施例，提供了一种网页布局方法，包括：

获取浏览器的当前窗口大小；

计算所述浏览器的当前窗口大小与第一预设值的第一比值，所述第一预设值为预先设置的所述浏览器的初始窗口大小；

将所述第一比值与基准值的乘积确定为所述网页的根元素的字体大小的当前值，其中，所述基准值为所述网页的根元素的字体大小的初始值；

根据所述当前值以及所述网页的各个元素相对于所述网页的根元素的字体大小的倍数，确定所述网页的各个元素的大小；

根据确定的所述网页的各个元素的大小显示所述网页。

对于上述方法，在一种可能的实现方式中，获取浏览器的当前窗口大小，包括：

在请求获取所述网页的情况下，获取所述浏览器的当前窗口大小；和/或，

在检测到所述浏览器的当前窗口大小发生变化的情况下，获取所述浏览器的当前窗口大小。

对于上述方法，在一种可能的实现方式中，获取浏览器的当前窗口大小，具体为：获取所述浏览器的当前窗口宽度；

计算所述浏览器的当前窗口大小与第一预设值的第一比值，具体为：计算所述浏览器的当前窗口宽度与所述第一预设值的所述第一比值；

所述第一预设值，具体为：预先设置的所述浏览器的初始窗口宽度。

对于上述方法，在一种可能的实现方式中，根据所述当前值以及所述网页的各个元素相对于所述网页的根元素的字体大小的倍数，确定所述网页的各个元素的大小，包括：

将所述当前值与所述网页的各个元素相对于所述网页的根元素的字体大小的倍数的乘积确定为所述网页的各个元素的大小。

对于上述方法，在一种可能的实现方式中，根据所述当前值以及所述网页的各个元素相对于所述网页的根元素的字体大小的倍数，确定所述网页的各个元素的大小，包括：

将所述当前值与所述网页的预设标签相对于所述网页的根元素的字体大小的倍数的乘积确定为第一参数；

根据所述第一参数加载所述预设标签，并获取加载的所述预设标签的大小；

若加载的所述预设标签的大小不在第一区间内，则计算所述第一参数与加载的所述预设标签的大小的第二比值，将所述当前值与所述第二比值的乘积确定为调整值，并将所述调整值与所述网页的各个元素相对于所述网页的根元素的字体大小的倍数的乘积确定为所述网页的各个元素的大小，其中，所述第一区间根据所述第一参数确定，所述第一参数在所述第一区间内；

若加载的所述预设标签的大小在所述第一区间内，则将所述当前值与所述网页的各个元素相对于所述网页的根元素的字体大小的倍数的乘积确定为所述网页的各个元素的大小。

为了解决上述技术问题，根据本发明的另一实施例，提供了一种网页布局装置，包括：

当前窗口大小获取模块，用于获取浏览器的当前窗口大小；

第一比值计算模块，用于计算所述浏览器的当前窗口大小与第一预设值的第一比值，所述第一预设值为预先设置的所述浏览器的初始窗口大小；

当前值确定模块，用于将所述第一比值与基准值的乘积确定为所述网页的根元素的字体大小的当前值，其中，所述基准值为所述网页的根元素的字体大小的初始值；

元素大小确定模块，用于根据所述当前值以及所述网页的各个元素相对于所述网页的根元素的字体大小的倍数，确定所述网页的各个元素的大小；

显示模块，用于根据确定的所述网页的各个元素的大小显示所述网页。

对于上述装置，在一种可能的实现方式中，所述当前窗口大小获取模块包括：

第一当前窗口大小获取子模块，用于在请求获取所述网页的情况下，获取所述浏览器的当前窗口大小；和/或，

第二当前窗口大小获取子模块，用于在检测到所述浏览器的当前窗口大小发生变化的情况下，获取所述浏览器的当前窗口大小。

对于上述装置，在一种可能的实现方式中，所述当前窗口大小获取模块具体用于：获取所述浏览器的当前窗口宽度；

所述第一比值计算模块具体用于：计算所述浏览器的当前窗口宽度与所述第一预设值的所述第一比值；

所述第一预设值，具体为：预先设置的所述浏览器的初始窗口宽度。

对于上述装置，在一种可能的实现方式中，所述元素大小确定模块具体用于：

将所述当前值与所述网页的各个元素相对于所述网页的根元素的字体大小的倍数的乘积确定为所述网页的各个元素的大小。

对于上述装置，在一种可能的实现方式中，所述元素大小确定模块包括：

第一参数确定子模块，用于将所述当前值与所述网页的预设标签相对于所述网页的根元素的字体大小的倍数的乘积确定为第一参数；

标签大小获取子模块，用于根据所述第一参数加载所述预设标签，并获取加载的所述预设标签的大小；

第一元素大小确定子模块，用于若加载的所述预设标签的大小不在第一区间内，则计算所述第一参数与加载的所述预设标签的大小的第二比值，将所述当前值与所述第二比值的乘积确定为调整值，并将所述调整值与所述网页的各个元素相对于所述网页的根元素的字体大小的倍数的乘积确定为所述网页的各个元素的大小，其中，所述第一区间根据所述第一参数确定，所述第一参数在所述第一区间内；

第二元素大小确定子模块，用于若加载的所述预设标签的大小在所述第一区间内，则将所述当前值与所述网页的各个元素相对于所述网页的根元素的字体大小的倍数的乘积确定为所述网页的各个元素的大小。

有益效果

通过预先将网页的各个元素的大小设置为网页的根元素的字体大小的倍数，在客户端进行网页布局时，只需根据浏览器的当前窗口大小调整网页的根元素的字体大小，而无需分别调整网页的每个元素的大小，根据本发明实施例的网页布局方法及装置能够减少网页布局中为兼容各种客户端、各种浏览器产生的工作量，提高网页布局效率，并降低网页加载时间。

根据下面参考附图对示例性实施例的详细说明，本发明的其它特征及方面将变得清楚。

附图说明

包含在说明书中并且构成说明书的一部分的附图与说明书一起示出了本发明的示例性实施例、特征和方面，并且用于解释本发明的原理。

图1示出根据本发明一实施例的网页布局方法的实现流程图；

图2示出根据本发明一实施例的网页布局方法的一示例性的实现流程图；

图3示出根据本发明一实施例的网页布局方法步骤S104的一示例性的具体实现流程图；

图4示出根据本发明一实施例的网页布局装置的结构框图；

图5示出根据本发明一实施例的网页布局装置的一示例性的结构框图；

图6示出根据本发明另一实施例的网页布局装置的一示例性的结构框图。

具体实施方式

以下将参考附图详细说明本发明的各种示例性实施例、特征和方面。附图中相同的附图标记表示功能相同或相似的元件。尽管在附图中示出了实施例的各种方面，但是除非特别指出，不必按比例绘制附图。

在这里专用的词“示例性”意为“用作例子、实施例或说明性”。这里作为“示例性”所说明的任何实施例不必解释为优于或好于其它实施例。

另外，为了更好的说明本发明，在下文的具体实施方式中给出了众多的具体细节。本领域技术人员应当理解，没有某些具体细节，本发明同样可以实施。在一些实例中，对于本领域技术人员熟知的方法、手段、元件和电路未作详细描述，以便于凸显本发明的主旨。

实施例1

图1示出根据本发明一实施例的网页布局方法的实现流程图。如图1所示，该方法主要包括：

在步骤S101中，获取浏览器的当前窗口大小。

需要说明的是，本发明实施例的执行主体可以为手机或者平板电脑等移动终端，也可以为PC(Personal Computer，个人计算机)，在此不作限定。

在本发明实施例中，可以通过JavaScript获取浏览器的当前窗口大小。

在步骤S102中，计算浏览器的当前窗口大小与第一预设值的第一比值，第一预设值为预先设置的浏览器的初始窗口大小。

其中，第一预设值可以为开发人员设计网页时预先设置的浏览器的初始窗口大小。例如，第一比值＝浏览器的当前窗口大小/第一预设值。计算浏览器的当前窗口大小与第一预设值的第一比值，可以判断浏览器的当前窗口大小与预先设置的浏览器的初始窗口大小是否相等。例如，第一比值等于1可以表示浏览器的当前窗口大小与预先设置的浏览器的初始窗口大小相等，在这种情况下，可以不调整网页的根元素的字体大小。也就是说，可以将该网页的根元素的字体大小的初始值作为该网页的根元素的字体大小的当前值。

在步骤S103中，将第一比值与基准值的乘积确定为网页的根元素的字体大小的当前值，其中，基准值为该网页的根元素的字体大小的初始值。

例如，在HTML5中，网页的根元素可以指<html>元素，网页的根元素的字体大小可以通过<html>元素的字段font-size来设置。基准值可以为开发人员设计网页时预先设置的该网页的根元素的字体大小的初始值。

例如，第一比值不等于1表示浏览器的当前窗口大小与预先设置的浏览器的初始窗口大小不相等。在这种情况下，可以将第一比值与基准值的乘积确定为网页的根元素的字体大小的当前值，以调整网页的根元素的字体大小。

在步骤S104中，根据当前值以及该网页的各个元素相对于该网页的根元素的字体大小的倍数，确定该网页的各个元素的大小。

其中，该网页的各个元素相对于该网页的根元素的字体大小的倍数，可以为开发人员在设计该网页时预先设置的。例如，采用相对单位rem来表示该网页的各个元素的大小，1rem＝该网页的根元素的字体大小。例如，1rem＝该网页的根元素的字体大小＝100px，某一图片元素的宽度为1.5rem，高度为1.4rem，则该图片元素的实际宽度为1.5×100px＝150px，该图片元素的实际高度为1.4×100px＝140px。

本发明实施例由于将网页的各个元素的大小预先设置为该网页的根元素的字体大小的倍数，因此，只需根据第一比值调整该网页的根元素的字体大小，而无需分别调整该网页的每个元素的大小。例如，浏览器的当前窗口大小与浏览器的初始窗口大小的第一比值为0.5，该网页的根元素的字体大小的初始值为100px，则在本发明实施例中，只需要将该网页的根元素的字体大小的当前值调整为50px，而无需分别调整该网页的每个元素的大小，从而能够减少网页布局中为兼容各种客户端、各种浏览器产生的工作量，提高网页布局效率，并降低网页加载时间。在调整该网页的根元素的字体大小的当前值之后，根据该网页的各个元素相对于该网页的根元素的字体大小的倍数，可以确定该网页的各个元素的大小。

在步骤S105中，根据确定的该网页的各个元素的大小显示该网页。

在本发明实施例中，根据确定的该网页的各个元素的大小显示该网页，从而实现对当前浏览器和客户端的兼容。

在一种可能的实现方式中，步骤S101获取浏览器的当前窗口大小，包括：

在请求获取该网页的情况下，获取浏览器的当前窗口大小；和/或，

在检测到浏览器的当前窗口大小发生变化的情况下，获取浏览器的当前窗口大小。

作为本发明实施例的一个示例，获取浏览器的当前窗口大小，可以为：在请求获取该网页的情况下，获取浏览器的当前窗口大小。在本示例中，可以在浏览器向服务器请求获取该网页的情况下，获取浏览器的当前窗口大小。

作为本发明实施例的另一个示例，获取浏览器的当前窗口大小，可以为：在检测到浏览器的当前窗口大小发生变化的情况下，获取浏览器的当前窗口大小。在本示例中，可以通过JavaScript实时检测浏览器的窗口大小，在检测到浏览器的当前窗口大小发生变化的情况下，获取浏览器的当前窗口大小。

作为本发明实施例的另一个示例，获取浏览器的当前窗口大小，可以为：在请求获取该网页或者检测到浏览器的当前窗口大小发生变化的情况下，获取浏览器的当前窗口大小。

图2示出根据本发明一实施例的该网页布局方法的一示例性的实现流程图。如图2所示：

在步骤S201中，获取浏览器的当前窗口宽度。

在本发明实施例中，获取浏览器的当前窗口大小具体可以为：获取浏览器的当前窗口宽度。例如，可以通过JavaScript获取浏览器的当前窗口宽度。

在步骤S202中，计算浏览器的当前窗口宽度与第一预设值的第一比值，第一预设值为预先设置的浏览器的初始窗口宽度。

在本发明实施例中，计算浏览器的当前窗口大小与第一预设值的第一比值，具体可以为：计算浏览器的当前窗口宽度与第一预设值的第一比值。第一预设值具体可以为：预先设置的浏览器的初始窗口宽度。在这里，第一预设值可以为开发人员设计网页时预先设置的浏览器的初始窗口宽度。

例如，浏览器的当前窗口宽度为360px，第一预设值为720px，则第一比值为0.5。

在步骤S203中，将第一比值与基准值的乘积确定为该网页的根元素的字体大小的当前值，其中，基准值为该网页的根元素的字体大小的初始值。

在步骤S204中，根据当前值以及该网页的各个元素相对于该网页的根元素的字体大小的倍数，确定该网页的各个元素的大小。

在步骤S205中，根据确定的该网页的各个元素的大小显示该网页。

在一种可能的实现方式中，步骤S104根据当前值以及该网页的各个元素相对于该网页的根元素的字体大小的倍数，确定该网页的各个元素的大小，包括：

将当前值与该网页的各个元素相对于该网页的根元素的字体大小的倍数的乘积确定为该网页的各个元素的大小。

例如，该网页的元素A的大小＝当前值×该网页的元素A相对于该网页的根元素的字体大小的倍数。例如，元素A的宽度为该网页的根元素的字体大小的1.5倍，元素A的高度为该网页的根元素的字体大小的1.4倍，当前值为50px，则元素A的宽度为75px，元素A的高度为60px。

图3示出根据本发明一实施例的该网页布局方法步骤S104的一示例性的具体实现流程图。如图3所示，根据所述当前值以及所述该网页的各个元素相对于所述该网页的根元素的字体大小的倍数，确定所述该网页的各个元素的大小，包括：

在步骤S301中，将当前值与该网页的预设标签相对于该网页的根元素的字体大小的倍数的乘积确定为第一参数。

由于终端设备之间存在差异，一些终端设备上的浏览器对于rem的支持存在异常，经测试，有些终端设备上的浏览器实际采用的当前值可能比计算出的当前值大，在这种情况下，可以对该网页的根元素的字体大小的当前值进行校正。

作为本发明实施例的一个示例，可以预先设计一个与该网页的其他元素无关的预设标签，例如，该预设标签的大小可以等于浏览器的窗口大小。例如，浏览器的窗口大小是该网页的根元素的字体大小的7.2倍，即该浏览器的窗口大小为7.2rem，则可以设置该预设标签的宽度也为7.2rem，即该预设标签的宽度为该网页的根元素的字体大小的7.2倍。第一参数＝当前值×该网页的预设标签相对于该网页的根元素的字体大小的倍数。该第一参数可以为计算出的预设标签的当前值，即预设标签的当前值的期望值。

在步骤S302中，根据第一参数加载预设标签，并获取加载的预设标签的大小。

在这里，加载的预设标签的大小可以为实际采用的预设标签的当前值，即预设标签的当前值的实际值。以该预设标签的大小等于浏览器的窗口大小为例，若加载的预设标签的大小大于第一参数，则加载的浏览器窗口可能会出现水平方向的滑动条，从而影响用户体验。因此，在这种情况下，需要对当前值进行调整，得到调整值，以更好地兼容当前使用的终端设备。

在步骤S303中，若加载的预设标签的大小不在第一区间内，则计算第一参数与加载的预设标签的大小的第二比值，将当前值与第二比值的乘积确定为调整值，并将调整值与该网页的各个元素相对于该网页的根元素的字体大小的倍数的乘积确定为该网页的各个元素的大小，其中，第一区间根据第一参数确定，第一参数在第一区间内。

作为本发明实施例的一个示例，第一区间可以仅包括第一参数这一个元素。例如，第一参数为720px，第一区间可以为[720px，720px]。

作为本发明实施例的另一个示例，第一区间也可以包括多个元素。例如，第一参数为Bpx，第一区间可以为[0.95Bpx，1.15Bpx]；再例如，第一参数为720px，第一区间可以为[715px,725px]，在此不作限定。

在本发明实施例中，若加载的预设标签的大小不在第一区间内，则可以对该网页的根元素的字体大小的当前值进行调整，得到调整值。该网页的各个元素的大小＝调整值×该网页的各个元素相对于该网页的根元素的字体大小的倍数。

在步骤S304中，若加载的预设标签的大小在第一区间内，则将当前值与该网页的各个元素相对于该网页的根元素的字体大小的倍数的乘积确定为该网页的各个元素的大小。

在本发明实施例中，若加载的预设标签的大小在第一区间内，则可以不对该网页的根元素的字体大小的当前值进行调整。

这样，通过预先将网页的各个元素的大小设置为网页的根元素的字体大小的倍数，在客户端进行网页布局时，只需根据浏览器的当前窗口大小调整网页的根元素的字体大小，而无需分别调整网页的每个元素的大小，根据本发明实施例的网页布局方法能够减少网页布局中为兼容各种客户端、各种浏览器产生的工作量，提高网页布局效率，并降低网页加载时间。

实施例2

图4示出根据本发明一实施例的网页布局装置的结构框图。为了便于说明，仅示出了与本发明实施例相关的部分。如图4所示，该装置包括：

当前窗口大小获取模块41，用于获取浏览器的当前窗口大小；

第一比值计算模块42，用于计算该浏览器的当前窗口大小与第一预设值的第一比值，该第一预设值为预先设置的该浏览器的初始窗口大小；

当前值确定模块43，用于将该第一比值与基准值的乘积确定为该网页的根元素的字体大小的当前值，其中，该基准值为该网页的根元素的字体大小的初始值；

元素大小确定模块44，用于根据该当前值以及该网页的各个元素相对于该网页的根元素的字体大小的倍数，确定该网页的各个元素的大小；

显示模块45，用于根据确定的该网页的各个元素的大小显示该网页。

图5示出根据本发明一实施例的网页布局装置的一示例性的结构框图。为了便于说明，仅示出了与本发明实施例相关的部分。图5中标号与图4相同的组件具有相同的功能，为简明起见，省略对这些组件的详细说明。如图5所示：

在一种可能的实现方式中，该当前窗口大小获取模块41包括：

第一当前窗口大小获取子模块411，用于在请求获取该网页的情况下，获取该浏览器的当前窗口大小；和/或，

第二当前窗口大小获取子模块412，用于在检测到该浏览器的当前窗口大小发生变化的情况下，获取该浏览器的当前窗口大小。

在一种可能的实现方式中，该当前窗口大小获取模块41具体用于：获取该浏览器的当前窗口宽度；

该第一比值计算模块42具体用于：计算该浏览器的当前窗口宽度与该第一预设值的该第一比值；

该第一预设值，具体为：预先设置的该浏览器的初始窗口宽度。

在一种可能的实现方式中，该元素大小确定模块44具体用于：

将该当前值与该网页的各个元素相对于该网页的根元素的字体大小的倍数的乘积确定为该网页的各个元素的大小。

对于上述装置，在一种可能的实现方式中，该元素大小确定模块44包括：

第一参数确定子模块441，用于将该当前值与该网页的预设标签相对于该网页的根元素的字体大小的倍数的乘积确定为第一参数；

标签大小获取子模块442，用于根据该第一参数加载该预设标签，并获取加载的该预设标签的大小；

第一元素大小确定子模块443，用于若加载的该预设标签的大小不在第一区间内，则计算该第一参数与加载的该预设标签的大小的第二比值，将该当前值与该第二比值的乘积确定为调整值，并将该调整值与该网页的各个元素相对于该网页的根元素的字体大小的倍数的乘积确定为该网页的各个元素的大小，其中，该第一区间根据该第一参数确定，该第一参数在该第一区间内；

第二元素大小确定子模块444，用于若加载的该预设标签的大小在该第一区间内，则将该当前值与该网页的各个元素相对于该网页的根元素的字体大小的倍数的乘积确定为该网页的各个元素的大小。

其中，第一参数确定子模块441与标签大小获取子模块442相连，标签大小获取子模块442与第一元素大小确定子模块443相连，标签大小获取子模块442与第二元素大小确定子模块444相连。

这样，通过预先将网页的各个元素的大小设置为网页的根元素的字体大小的倍数，在客户端进行网页布局时，只需根据浏览器的当前窗口大小调整网页的根元素的字体大小，而无需分别调整网页的每个元素的大小，根据本发明实施例的网页布局装置能够减少网页布局中为兼容各种客户端、各种浏览器产生的工作量，提高网页布局效率，并降低网页加载时间。

实施例3

图6示出本发明另一个实施例的一种网页布局装置的一示例性的结构框图。所述网页布局装置1100可以是具备计算能力的主机服务器、个人计算机PC、或者可携带的便携式计算机或终端等。本发明具体实施例并不对计算节点的具体实现做限定。

所述网页布局装置1100包括处理器(processor)1110、通信接口(CommunicationsInterface)1120、存储器(memory)1130和总线1140。其中，处理器1110、通信接口1120、以及存储器1130通过总线1140完成相互间的通信。

通信接口1120用于与网络设备通信，其中网络设备包括例如虚拟机管理中心、共享存储等。

处理器1110用于执行程序。处理器1110可能是一个中央处理器CPU，或者是专用集成电路ASIC(Application Specific Integrated Circuit)，或者是被配置成实施本发明实施例的一个或多个集成电路。

存储器1130用于存放文件。存储器1130可能包含高速RAM存储器，也可能还包括非易失性存储器(non-volatile memory)，例如至少一个磁盘存储器。存储器1130也可以是存储器阵列。存储器1130还可能被分块，并且所述块可按一定的规则组合成虚拟卷。

在一种可能的实施方式中，上述程序可为包括计算机操作指令的程序代码。该程序具体可包含用于执行以下操作的指令：

获取浏览器的当前窗口大小；

计算该浏览器的当前窗口大小与第一预设值的第一比值，该第一预设值为预先设置的该浏览器的初始窗口大小；

将该第一比值与基准值的乘积确定为该网页的根元素的字体大小的当前值，其中，该基准值为该网页的根元素的字体大小的初始值；

根据该当前值以及该网页的各个元素相对于该网页的根元素的字体大小的倍数，确定该网页的各个元素的大小；

根据确定的该网页的各个元素的大小显示该网页。

假设上述为第一种可能的实施方式，则在第一种可能的实施方式作为基础而提供的第二种可能的实施方式中，该程序还可包含用于执行以下操作的指令：

获取浏览器的当前窗口大小，包括：

在请求获取该网页的情况下，获取该浏览器的当前窗口大小；和/或，

在检测到该浏览器的当前窗口大小发生变化的情况下，获取该浏览器的当前窗口大小。

在第一种可能的实施方式作为基础而提供的第三种可能的实施方式中，该程序还可包含用于执行以下操作的指令：

获取浏览器的当前窗口大小，具体为：获取该浏览器的当前窗口宽度；

计算该浏览器的当前窗口大小与第一预设值的第一比值，具体为：计算该浏览器的当前窗口宽度与该第一预设值的该第一比值；

该第一预设值，具体为：预先设置的该浏览器的初始窗口宽度。

在第一种、第二种或第三种可能的实施方式作为基础而提供的第四种可能的实施方式中，该程序还可包含用于执行以下操作的指令：

根据该当前值以及该网页的各个元素相对于该网页的根元素的字体大小的倍数，确定该网页的各个元素的大小，包括：

将该当前值与该网页的各个元素相对于该网页的根元素的字体大小的倍数的乘积确定为该网页的各个元素的大小。

在第一种、第二种或第三种可能的实施方式作为基础而提供的第四种可能的实施方式中，该程序还可包含用于执行以下操作的指令：

根据该当前值以及该网页的各个元素相对于该网页的根元素的字体大小的倍数，确定该网页的各个元素的大小，包括：

将该当前值与该网页的预设标签相对于该网页的根元素的字体大小的倍数的乘积确定为第一参数；

根据该第一参数加载该预设标签，并获取加载的该预设标签的大小；

若加载的该预设标签的大小不在第一区间内，则计算该第一参数与加载的该预设标签的大小的第二比值，将该当前值与该第二比值的乘积确定为调整值，并将该调整值与该网页的各个元素相对于该网页的根元素的字体大小的倍数的乘积确定为该网页的各个元素的大小，其中，该第一区间根据该第一参数确定，该第一参数在该第一区间内；

若加载的该预设标签的大小在该第一区间内，则将该当前值与该网页的各个元素相对于该网页的根元素的字体大小的倍数的乘积确定为该网页的各个元素的大小。

本领域普通技术人员可以意识到，本文所描述的实施例中的各示例性单元及算法步骤，能够以电子硬件、或者计算机软件和电子硬件的结合来实现。这些功能究竟以硬件还是软件形式来实现，取决于技术方案的特定应用和设计约束条件。专业技术人员可以针对特定的应用选择不同的方法来实现所描述的功能，但是这种实现不应认为超出本发明的范围。

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

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

Claims (10)

1.一种网页布局方法，其特征在于，包括：

获取浏览器的当前窗口大小；

计算所述浏览器的当前窗口大小与第一预设值的第一比值，所述第一预设值为预先设置的所述浏览器的初始窗口大小；

将所述第一比值与基准值的乘积确定为所述网页的根元素的字体大小的当前值，其中，所述基准值为所述网页的根元素的字体大小的初始值；

根据所述当前值以及所述网页的各个元素相对于所述网页的根元素的字体大小的倍数，确定所述网页的各个元素的大小；

根据确定的所述网页的各个元素的大小显示所述网页。

2.根据权利要求1所述的方法，其特征在于，获取浏览器的当前窗口大小，包括：

在请求获取所述网页的情况下，获取所述浏览器的当前窗口大小；和/或，

在检测到所述浏览器的当前窗口大小发生变化的情况下，获取所述浏览器的当前窗口大小。

3.根据权利要求1所述的方法，其特征在于，获取浏览器的当前窗口大小，具体为：获取所述浏览器的当前窗口宽度；

计算所述浏览器的当前窗口大小与第一预设值的第一比值，具体为：计算所述浏览器的当前窗口宽度与所述第一预设值的所述第一比值；

所述第一预设值，具体为：预先设置的所述浏览器的初始窗口宽度。

4.根据权利要求1至3任意一项所述的方法，其特征在于，根据所述当前值以及所述网页的各个元素相对于所述网页的根元素的字体大小的倍数，确定所述网页的各个元素的大小，包括：

将所述当前值与所述网页的各个元素相对于所述网页的根元素的字体大小的倍数的乘积确定为所述网页的各个元素的大小。

5.根据权利要求1至3任意一项所述的方法，其特征在于，根据所述当前值以及所述网页的各个元素相对于所述网页的根元素的字体大小的倍数，确定所述网页的各个元素的大小，包括：

将所述当前值与所述网页的预设标签相对于所述网页的根元素的字体大小的倍数的乘积确定为第一参数；

根据所述第一参数加载所述预设标签，并获取加载的所述预设标签的大小；

若加载的所述预设标签的大小不在第一区间内，则计算所述第一参数与加载的所述预设标签的大小的第二比值，将所述当前值与所述第二比值的乘积确定为调整值，并将所述调整值与所述网页的各个元素相对于所述网页的根元素的字体大小的倍数的乘积确定为所述网页的各个元素的大小，其中，所述第一区间根据所述第一参数确定，所述第一参数在所述第一区间内；

若加载的所述预设标签的大小在所述第一区间内，则将所述当前值与所述网页的各个元素相对于所述网页的根元素的字体大小的倍数的乘积确定为所述网页的各个元素的大小。

6.一种网页布局装置，其特征在于，包括：

当前窗口大小获取模块，用于获取浏览器的当前窗口大小；

第一比值计算模块，用于计算所述浏览器的当前窗口大小与第一预设值的第一比值，所述第一预设值为预先设置的所述浏览器的初始窗口大小；

当前值确定模块，用于将所述第一比值与基准值的乘积确定为所述网页的根元素的字体大小的当前值，其中，所述基准值为所述网页的根元素的字体大小的初始值；

元素大小确定模块，用于根据所述当前值以及所述网页的各个元素相对于所述网页的根元素的字体大小的倍数，确定所述网页的各个元素的大小；

显示模块，用于根据确定的所述网页的各个元素的大小显示所述网页。

7.根据权利要求6所述的装置，其特征在于，所述当前窗口大小获取模块包括：

第一当前窗口大小获取子模块，用于在请求获取所述网页的情况下，获取所述浏览器的当前窗口大小；和/或，

第二当前窗口大小获取子模块，用于在检测到所述浏览器的当前窗口大小发生变化的情况下，获取所述浏览器的当前窗口大小。

8.根据权利要求6所述的装置，其特征在于，所述当前窗口大小获取模块具体用于：获取所述浏览器的当前窗口宽度；

所述第一比值计算模块具体用于：计算所述浏览器的当前窗口宽度与所述第一预设值的所述第一比值；

所述第一预设值，具体为：预先设置的所述浏览器的初始窗口宽度。

9.根据权利要求6至8任意一项所述的装置，其特征在于，所述元素大小确定模块具体用于：

将所述当前值与所述网页的各个元素相对于所述网页的根元素的字体大小的倍数的乘积确定为所述网页的各个元素的大小。

10.根据权利要求6至8任意一项所述的装置，其特征在于，所述元素大小确定模块包括：

第一参数确定子模块，用于将所述当前值与所述网页的预设标签相对于所述网页的根元素的字体大小的倍数的乘积确定为第一参数；

标签大小获取子模块，用于根据所述第一参数加载所述预设标签，并获取加载的所述预设标签的大小；

第一元素大小确定子模块，用于若加载的所述预设标签的大小不在第一区间内，则计算所述第一参数与加载的所述预设标签的大小的第二比值，将所述当前值与所述第二比值的乘积确定为调整值，并将所述调整值与所述网页的各个元素相对于所述网页的根元素的字体大小的倍数的乘积确定为所述网页的各个元素的大小，其中，所述第一区间根据所述第一参数确定，所述第一参数在所述第一区间内；

第二元素大小确定子模块，用于若加载的所述预设标签的大小在所述第一区间内，则将所述当前值与所述网页的各个元素相对于所述网页的根元素的字体大小的倍数的乘积确定为所述网页的各个元素的大小。