认识达内从这里开始

认真做教育专心促就业

南宁达内培训低代码网页架构布局模式都有哪些类型

发布：南宁达内it培训
来源：互联网
时间：2023-03-16 09:42

低代码编程开发技术随着互联网的不断发展而被越来越多的程序员掌握，今天我们就通过案例分析来简单了解一下，低代码网页架构布局模式都有哪些类型。

南宁达内培训低代码网页架构布局模式都有哪些类型

网格(Grid)布局

网格布局(Grid)是CSS(层叠样式表，为网页添加页面样式的一种计算机语言)布局方案的一种，也是泛用性广泛的一种。其原理是将网页划分成一个个网格，通过任意组合不同的网格，做出各种各样的布局。

Grid布局示意图

由于网格属于标准的二维布局，因此网格布局将页面划分为“行”与“列”，产生单元格，对单元格的设置与组合，终形成页面终的效果。活字格的设计器是类excel风格，所以天生就是一个适应Grid布局的高手。活字格为用户提供了3种设置模式，分别是固定模式、自适应模式和范围模式，通过设置行高、列宽的调节模式为自适应模式或范围模式，可使页面呈现流式布局，使页面的布局更加灵活。

固定模式

固定模式下，行高、列宽为固定的大小，单位为像素，不会随着展示屏幕的变化而变化，如果页面所有被设定了固定模式的行列总像素已经大于了浏览器的宽度/高度，那浏览器中就会出现横向/纵向滚动条。

自适应模式

在活字格中，自适应代表的不是页面自适应，而是组件的自适应。活字格的页面设计是所见即所得的，每一个组件都是通过单元格的组合而形成。当对某个组件设置了自适应之后，组件会根据内部的内容动态的变化自己的高度或宽度，比如文本框，会根据输入的文字内容来动态调节自己的框体大小，附件单元格会按照数据的多少来扩展高度。

范围模式

范围模式的主要作用是充满整个浏览器屏幕，也是想要实现流式布局为推荐的做法。

在活字格中，范围模式提供了按照像素与占比两种方式来设定范围

活字格的范围模式设置界面

在整个页面占据的比例为1份，也就是说，如果整个页面，只有当前列被设置了占比为1，那么只有这一列会填充整个页面。而如果页面中有两列都设置了占比为1，这两列在整个页面中会按照各自占据1/2的范围来填充，如果有一列设置了1份，另一列设置了2份，那么终的填充效果为设置为1的列占据了1/3，而另外一列占据2/3。

行列自动扩展

活字格的每个行列，都可以设置以上3种模式，而占用多行区域的单元格，设置一行或者一列时，这个容器区域内部会自动扩展。比如：表格，图文列表，数据透视表，页面容器单元格，标签页，选项卡等。

多行区域的单元格范围设置

通过设置范围模式达到内容自动填充页面的效果

【免责声明】：本内容转载于网络，转载目的在于传递信息。文章内容为作者个人意见，本平台对文中陈述、观点保持中立，不对所包含内容的准确性、可靠性与完整性提供形式地保证。请读者仅作参考。更多内容请加danei456学习了解。欢迎关注“达内在线”参与分销，赚更多好礼。

< 上一篇：南宁达内IT培训微服务洞察的概念与应用分析

下一篇：南宁达内Java培训程序员需要掌握哪些页面性能优化方法 >