底部滑出面板

Web需自己实现

Web 原生没有这个

Web 没有专门的底部面板元素，现有 dialog 只提供对话框语义，不会直接产生从底部滑出的面板。Drawer 这个词在 Web 里也常指从侧边滑出的抽屉，容易混。

通常怎么做：使用 <dialog> 或绝对定位配合 CSS transform 自行实现，也可以使用 Radix Dialog、Vaul 这类第三方组件。

适用范围：桌面与移动端主流浏览器

社区一般叫它 Bottom Sheet · Drawer · Sheet

从屏幕底部向上滑出、盖住部分屏幕的临时面板。背后的页面通常会变暗但还看得见，往下拖或点背景就能关掉。

其他平台的相似实现

iOS原生支持

Sheet本平台没有对应叫法

Apple 管这个叫 Sheet。

Android原生支持

Bottom Sheet本平台没有对应叫法

Material Design 里分 Modal（挡住交互）和 Standard（不挡）两种。

Bottom Sheet 是能承载任意内容和短任务的面板；Action Sheet 只让用户从当前操作的选项中做选择。

Web

做一个从屏幕底部滑出的 bottom sheet，支持拖拽关闭，背景蒙层半透明，高度为屏幕的 50%，可以拖到 90%。