|
前言 低码工具更侧重于前端开发，学习前端开发必须熟练掌握CSS的相关知识。本篇就重点介绍一下在低码中的布局相关知识。 一、网格布局 网格布局可以和word里的表格做同类型联系，比如我在word里插入一个表格。
一共是插入了一行12列，而网格布局里的属性可以自由选择，第一个12就代表着一行一列
一行一列自然就只有一个插槽，这个插槽就是我们可以添加内容的容器，里边可以放图片、文本、普通容器这些组件。 如果选择6:6就表示一行两列，可以有两个插槽
至于列比例如何选择要根据你的页面的设计决定。 什么时候选择网格布局比较好，一般在首页像那种有功能导航的，比较适合网格布局。因为功能是确定的，你可以决定一行放几个布局。如果像商品列表，那种要根据商品的数量来决定显示几行的，就不太适合网格布局。 二、flex布局 flex布局也叫流式布局，可以想象像水流一样，从左到右流，到了边缘又到下一行从左到右流。
因为有了这个流动的方向，自然就有了水平和垂直的概念，通过水平和垂直来决定你里边的容器的摆布。比如你希望元素水平居中对齐，垂直居中对齐，就可以靠这两个方向的对齐方式来进行布局。 那flex布局通常用在哪个组件上呢？通常用在普通容器上，由普通容器来决定里边的元素的摆放位置。
三、布局的元素 除了上述两个布局组件外，在布局组件里最常使用的两个组件是图片和文本 图片组件一般用来显示素材，我们需要的素材一般都放置在素材库里
需要将设计师制作的各种素材添加进来方便组件进行设置和引用
图片组件的图片地址属性可以通过从素材库里选择素材进行设置
选择了之后会自动显示图片
图片组件的话日常需要设置合适的宽和高，让图片的显示和设计图一样
文本组件的话常常设置文本的内容
除了文本内容外还可以设置对齐方式和颜色。 四、总结 以上就是低码中常用的布局组件，一般将这四个组件用熟练了，大部分的布局都可以搭建出来。 |
|
|
