[发明专利]网页适配方法、装置和系统、设备

说明书

本发明公开了网页适配方法、装置和系统、设备，其中网页适配方法，包括获取网页模板中编辑区域的区域比例和显示屏幕的屏幕比例；在所述区域比例与所述屏幕比例不一致的情况下，调整所述网页模板中编辑区域的坐标值，以使所述网页模板中编辑区域于所述屏幕比例对应的虚拟网页模板框架中完全且居中显示；适配所述网页模块于所述显示屏幕，以使所述编辑区域的坐标长度转换后的像素长度与所述显示屏幕的像素长度一致，或者，所述编辑区域的坐标宽度转换后的像素宽度与所述显示屏幕的像素宽度一致。本申请将固定比例网页模板自动适配于不同屏幕比例的移动设备，最大限度地还原网页编辑器所开发的网页模板。

技术领域

本发明涉及终端技术领域，尤其涉及网页适配方法、装置和系统、设备。

背景技术

目前移动终端的机型繁杂，不同机型移动终端的显示屏幕的屏幕比例不尽相同。移动终端安装的浏览器可以显示网页(又称H5页面)，为了满足不同屏幕比例的需求，通常会开发出多种主流屏幕比例的网页模板，以适用于不同屏幕比例的移动终端。

由于主流屏幕比例较多所以需开发网页的种类也较多，并且目前网页开发过程中需要开发人员自己创建组件较为繁琐，为了简化网页开发过程，衍生出网页编辑器(又称H5编辑器)。

在网页编辑器上可以采用拖拽方式添加组件，比如一个音乐组件，可以直接拖拽到网页上添加音乐列表，开发完成的网页模板便具有音乐播放功能，从而简单、方便地开发完成网页模板。

但是，目前网页编辑器只有一个固定比例的视窗，开发完成的网页模板也为该固定比例。直接使用固定比例的网页模板到不同屏幕比例的移动终端，会出现显示屏幕中的网页显示不完整、网页背景留白过多，网页中组件长宽比例变形等不适配问题。

发明内容

鉴于上述问题，提出了本发明以便提供一种克服上述问题或者至少部分地解决上述问题的网页适配方法、装置和系统，以便将固定比例网页模板自动适配于不同屏幕比例的移动设备，最大限度地还原网页编辑器所开发的网页模板。

为了实现上述目的，本申请提供了下述技术特征：

一种网页适配方法，包括：

获取网页模板中编辑区域的区域比例和显示屏幕的屏幕比例；

在对比所述区域比例和所述屏幕比例后确定所述显示屏幕过宽的情况下，调整所述网页模板中编辑区域的多个坐标值，以使所述网页模板中编辑区域在虚拟网页模板框架与所述屏幕比例对应的情况下完全显示；

适配所述网页模板于所述显示屏幕。

一种网页适配装置，包括：

获取比例单元，用于获取网页模板中编辑区域的区域比例和显示屏幕的屏幕比例；

过宽调整单元，用于在对比所述区域比例和所述屏幕比例后确定所述显示屏幕过宽的情况下，调整所述网页模板中编辑区域的多个坐标值，以使所述网页模板中编辑区域在虚拟网页模板框架与所述屏幕比例对应的情况下完全显示；

一种网页适配系统，包括：

网页编辑终端，用于生成网页模板，获取网页模板的网页标识并构建网页模板和网页标识的关联关系，上传网页模板、网页标识和关联关系至服务器；

服务器，用于存储网页模板，网页标识，以及网页模板和网页标识关联关系；接收移动终端发送的网页模板获取指令，并反馈与网页模板获取指令中网页标识关联的网页模板至移动终端；