在你的 Web 应用中添加 Snackbar:
Snackbar 是 Material Design 组件库中实用的小组件之一，具有可定制的外观和可编程的行为，使得短且及时的信息以半透明的方式出现。这是为了提醒我们用户的某些动作是否被触发，或向他们提供不可用的情况下的必要反馈。
什么是 Snackbar？
从技术上讲，Snackbar 是一个 Material Design 组件库中的一部分，类似于 Toast（另一个弹出式消息时的可见的短暂消息），Snackbar 在用户界面的底部（或顶部）上方出现。然而，Snackbar 可以执行丰富的反馈动作，例如向用户提供有用的意见和问题解决，这使得它异于 Toast 和其他系统消息。Snackbar 的一些特性如下：
- 简短且必要的信息
- 易于隐藏和消失
- 提供自行定义的操作，如点击通知打开某个后续界面，或关闭 Snackbar 等其他反馈操作
如何在 Web 应用中为 Snackbar 编写 CSS 样式？
Snackbar 的外观受到一系列 HTML 和 CSS 样式的控制。有两种方式可以自定义 Snackbar 外观：使用 CSS，或使用 Material Design Lite。在代码示例中，我们将使用 Material Design Lite 库的 Snackbar 组件，因为它几乎可以自动适应我们的设计。这是一种通过使用非常少的 CSS 和 HTML 来实现的最强大的方式来定义 Snackbar 样式。在 Material Design Lite 中，使用 Snackbar 组件十分容易。
首先，确保在您的应用程序中添加了 Material Design Lite 内容：
``````接下来，在您的 HTML 文件中加入以下代码来生成 Snackbar：
Message sent
请注意，#snackbar 元素是我们在定义 Snackbar 样式时需要使用的元素 ID。但是，我们必须使用 JavaScript 动态添加 Snackbar 到 DOM 中：
``` var snackbarContainer = document.querySelector('#snackbar'); var data = {message: 'Your Message was sent'}; snackbarContainer.MaterialSnackbar.showSnackbar(data);```总结
Snackbar 是一种非常实用的小部件，它可以用于您的 Web 应用程序，以向用户提供有用的反馈信息。您可以使用 CSS 或 Material Design Lite 中的 Snackbar 组件来自定义它的外观。Snackbars 可以使用提示让用户更容易了解他们最近的活动，这对于那些需要快速完成用户动作的应用程序非常有用。
