---
title: "界面搭建概述"
description: "NocoBase 界面搭建：所见即所得配置模式，布局模板、页面、区块、操作、表格列配置，无需编码自定义界面，支持配置模式与使用模式切换。"
keywords: "界面搭建,所见即所得,区块,页面配置,布局模板,操作配置,表格列,NocoBase"
---

# 界面搭建

## 所见即所得

NocoBase 采用所见即所得的界面搭建模式。点击界面搭建按钮，可以在配置模式和使用模式之间切换。

使用模式：

![20251023215845](https://static-docs.nocobase.com/20251023215845.png)

配置模式：

![20251023215951](https://static-docs.nocobase.com/20251023215951.png)

## 布局模板

NocoBase 内置一个布局模板，顶部和左侧是导航区域，右侧是内容区域。

![未命名.002](https://static-docs.nocobase.com/未命名.002.jpeg)

## 配置项

进入界面搭建模式后，界面上会出现橙色的可配置项。通常，每个可配置元素的配置项入口位于该元素的右上角。几乎所有元素都可以在界面上实时配置和查看效果，以下是几个示例：

菜单的配置项：

![20251023221617](https://static-docs.nocobase.com/20251023221617.png)

页面的配置项：

![20251023221649](https://static-docs.nocobase.com/20251023221649.png)

区块的配置项：

![20251023221748](https://static-docs.nocobase.com/20251023221748.png)

操作的配置项：

![20251023222109](https://static-docs.nocobase.com/20251023222109.png)

表格列的配置项：

![20251023221814](https://static-docs.nocobase.com/20251023221814.png)
