Toast 是出现在屏幕上的一条小消息。它用于移动和桌面的一些反馈消息或推送通知。例如;当您通过 Gmail 发送消息时，您会收到作为发送消息的 Toast 通知… Toast 消息会在屏幕上保留几秒钟，不会阻止您的工作。它只是一个带有一些文本和图标的信息框。现在让我们看看如何使用 Bootstrap 创建一个 Toast。

1. Bootstrap Toast 通知是使用 Flex 构建的，因此您可以轻松地将它们对齐和定位在屏幕上的任何位置。
2. Toast 非常灵活，只需要很少的标记。单个元素可用作 Toast 内容。
3. 您还可以在 Toast 中添加关闭按钮。
4. Toast需要包装在 aria-live 区域中，并且还应该分配一些角色。
5. 如果它是一条重要消息（例如错误）并且需要引起注意，则分配 role=”alert” 和 aria-live=”assertive”。
6. 否则使用 role=”status” 和 aria-live=”polite”。
7. 属性 aria-atomic=”true” 用于确保始终将整个 toast 声明为单个原子单元

示例：使用 Bootstrap 5 创建基本 Toast

.toast 类用于创建 toast 元素。 Toast 包含一个 .toast-header 类和 .toast-body 类。在这里，我们在 toast 标题中添加了一个关闭按钮。添加带有 .toast 类的 show，以便 toast 通知出现在您的屏幕上。