网页布局的方法及装置、电子设备和存储介质制造方法及图纸

本公开了一种网页布局的方法及装置、电子设备和存储介质，响应于网页布局调整指令，基于预设接口获取目标视口的显示特征参数，其中，显示特征参数包括：视口尺寸参数、设备像素比；根据视口尺寸参数，将目标视口对应的显示设备归类至对应的屏幕规格分类；在设备像素比偏离参考值时，基于屏幕规格分类及显示特征参数，计算目标视口中各界面元素在显示设备中的补偿缩放比例；按照补偿缩放比例对各界面元素进行布局优化渲染处理。与相关技术相比，本公开实施例通过视口尺寸参数将显示设备归类至屏幕规格分类，突破传统固定断点的刚性限制。通过对目标视口进行归类，解决超宽屏场景下固定宽度元素导致的主内容区空白问题，提升屏幕空间利用率。

【技术实现步骤摘要】

本公开涉及数据处理，尤其涉及一种目标训练的方法及装置、电子设备和存储介质。

技术介绍

1、当前显示设备多样化发展，屏幕分辨率从1280×720拓展到8k超高清(7680×4320)，屏幕比例从16:9延伸至21:9、32:9等超宽比例，高ppi的4k/8k屏幕逐渐普及。这给网页显示带来诸多问题：高像素密度(pixels perinch，ppi)显示器上，网页元素的物理尺寸过小，如218ppi显示器上12px逻辑像素对应物理尺寸仅0.08毫米，低于人眼可读阈值，用户需手动缩放浏览器，操作不便且影响效率。传统响应式布局技术应对乏力，超宽屏场景下，固定宽度设计的侧边栏或导航栏会使主内容区出现大面积空白，浪费屏幕空间，降低信息展示效率。统一缩放比例方案在复杂布局中问题不断，会导致三栏布局中间栏内容断裂、侧边栏图标溢出，元素显示过大或过小，造成视觉跳跃，严重影响用户体验和网页可用性。

技术实现思路

1、本公开提供了一种网页布局的方法及装置、电子设备和存储介质。其主要目的在于解决相关技术中网页布局中元素尺寸不适配、布局错本文档来自技高网...

【技术保护点】

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

2.根据权利要求1所述的网页布局的方法，其特征在于，所述根据所述视口尺寸参数，将所述目标视口对应的显示设备归类至对应的屏幕规格分类，包括：

3.根据权利要求2所述的网页布局的方法，其特征在于，所述将所述视口尺寸参数分别与不同所述屏幕规格分类对应的分类基准数据进行相似度对比，包括：

4.根据权利要求3所述的网页布局的方法，其特征在于，所述根据相似度对比结果及所述视口尺寸参数，将所述显示设备划分至其所属的屏幕规格分类，包括：

5.根据权利要求1所述的网页布局的方法，其特征在于，所述基于所述屏幕规格分类...

【技术特征摘要】

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

2.根据权利要求1所述的网页布局的方法，其特征在于，所述根据所述视口尺寸参数，将所述目标视口对应的显示设备归类至对应的屏幕规格分类，包括：

3.根据权利要求2所述的网页布局的方法，其特征在于，所述将所述视口尺寸参数分别与不同所述屏幕规格分类对应的分类基准数据进行相似度对比，包括：

4.根据权利要求3所述的网页布局的方法，其特征在于，所述根据相似度对比结果及所述视口尺寸参数，将所述显示设备划分至其所属的屏幕规格分类，包括：

5.根据权利要求1所述的网页布局的方法，其特征在于，所述基于所述屏幕规格分类及所述显示特征参数，计算所述目标视口...

【专利技术属性】
技术研发人员：许磊，
申请(专利权)人：济南浪潮数据技术有限公司，
类型：发明
国别省市：