网页响应式布局方法技术

本发明专利技术公开了一种网页响应式布局方法、介质及设备，其中方法包括：获取用户发送的网页访问请求，并根据网页访问请求向用户的浏览设备发送相应的网页文件，其中，网页文件中包含网页对应的布局计算模块代码和布局约束数据；浏览设备获取网页文件，并执行布局计算模块代码，以启动布局计算模块；通过布局计算模块根据浏览设备的尺寸信息和布局约束数据进行布局计算，以得到浏览设备对应的布局位置信息；根据布局位置信息对网页显示进行更新；能够实现在不同浏览设备上对网页进行准确地布局，保证网页的视觉效果，提高用户的交互体验。

【技术实现步骤摘要】
网页响应式布局方法
本专利技术涉及网页布局
，特别涉及一种网页响应式布局方法、一种计算机可读存储介质和一种计算机设备。
技术介绍
在浏览器网页界面开发领域中，为了让网页内容适应不同尺寸的浏览设备(例如，手机、平板和电脑等)；需要根据浏览设备的特征为网页内容设置不同的布局和外观。相关技术中，多采用层叠样式表进行网页的布局和外观的声明。但是，在网页中，有些页面视觉元素是直接由脚本控制位置，而有些是在画布中绘制的；无法被层叠样式表控制位置；进而导致视觉元素在不同设备上展示时，出现显示位置不准确、难以交互和视觉效果不佳等问题。
技术实现思路
本专利技术旨在至少在一定程度上解决上述技术中的技术问题之一。为此，本专利技术的一个目的在于提出一种网页响应式布局方法，能够实现在不同浏览设备上对网页进行准确地布局，保证网页的视觉效果，提高用户的交互体验。本专利技术的第二个目的在于提出一种计算机可读存储介质。本专利技术的第三个目的在于提出一种计算机设备。为达到上述目的，本专利技术第一方面实施例提出了一种网页响本文档来自技高网...

【技术保护点】
1.一种网页响应式布局方法，其特征在于，包括以下步骤：/n获取用户发送的网页访问请求，并根据所述网页访问请求向所述用户的浏览设备发送相应的网页文件，其中，所述网页文件中包含所述网页对应的布局计算模块代码和布局约束数据；/n所述浏览设备获取所述网页文件，并执行所述布局计算模块代码，以启动布局计算模块；/n通过所述布局计算模块根据所述浏览设备的尺寸信息和所述布局约束数据进行布局计算，以得到所述浏览设备对应的布局位置信息；/n根据所述布局位置信息对网页显示进行更新。/n

【技术特征摘要】
1.一种网页响应式布局方法，其特征在于，包括以下步骤：
获取用户发送的网页访问请求，并根据所述网页访问请求向所述用户的浏览设备发送相应的网页文件，其中，所述网页文件中包含所述网页对应的布局计算模块代码和布局约束数据；
所述浏览设备获取所述网页文件，并执行所述布局计算模块代码，以启动布局计算模块；
通过所述布局计算模块根据所述浏览设备的尺寸信息和所述布局约束数据进行布局计算，以得到所述浏览设备对应的布局位置信息；
根据所述布局位置信息对网页显示进行更新。


2.如权利要求1所述的网页响应式布局方法，其特征在于，所述布局约束数据包括多个数组，每个所述数组包括多个数组子元素，以通过数组子元素描述网页中相应视觉元素的约束条件。


3.如权利要求2所述的网页响应式布局方法，其特征在于，所述视觉元素的约束条件包括数组子元素对应的浏览设备特征信息、数组子元素对应的视觉元素唯一标识、视觉元素的尺寸信息、视觉元素不参与布局计算时的位置信息。


4.如权利要求2所述的网页响应式布局方法，其特征在于，所述视觉元素包括容器视觉元素和子视觉元素，其中，所述容器视觉元素用于承载所述子视觉元素。

【专利技术属性】
技术研发人员：卫少基，
申请(专利权)人：稿定厦门科技有限公司，
类型：发明
国别省市：福建;35