> ## Documentation Index
> Fetch the complete documentation index at: https://docs.landerlab.io/llms.txt
> Use this file to discover all available pages before exploring further.

# 用 Box 构建落地页结构

> 用 Box 容器分组和嵌套元素，控制方向、对齐、分布和间距，并设置背景、边框和阴影，精准搭建落地页布局。

Box 是 LanderLab 中最重要的布局工具之一。

它让你在页面内部更精细地分组、组织和控制元素。

## 什么是 Box

Box 是一个容器，里面可以装其他元素。

可以放进 Box 的内容：

* 文本
* 图片
* 按钮
* 列表
* 其他 Box

👉 可以把它看成一个包裹层，帮你组织内容结构。

<Note>
  重要提示

  * Box 是构建布局的关键
  * Box 可以嵌套，灵活性更高
  * 大多数对齐和间距问题都能用 Box 解决
</Note>

### 如何添加 Box

* 打开左侧边栏
* 进入 **Layout**
* 把 **Box** 拖到某个 section 或分栏内

## Box 为什么重要

Box 让你更好地控制元素的排列方式。

常见用途：

* 把相关元素归为一组
* 让元素正确对齐
* 搭建更复杂的布局
* 精调间距和位置

👉 大多数精细布局都要靠 Box 才能做好。

## Box 的工作方式

结构示例：<br />Section → Columns → Box → 元素

* Box 位于分栏或 section 内
* 元素放在 Box 内部
* Box 还可以嵌套在其他 Box 里，控制更精细

## 布局控制

选中一个 Box 后，你可以控制：

* **Direction**：横排或竖排
* **Alignment**：元素对齐方式（左、中、右）
* **Distribution**：元素在空间中的分布
* **Gap**：元素之间的间距

大部分布局调整都在这里完成。

## 样式选项

Box 还支持：

* 背景（纯色或渐变）
* 间距（padding 与 margin）
* 边框和圆角
* 阴影
* 宽度和高度


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.