Components
shadcn/ui
The Foundation for your Design System
A set of beautifully designed components that you can customize, extend, and build on.
import { Separator } from "@/components/ui/separator"
export function SeparatorDemo() {安装
pnpm dlx shadcn@latest add separator
用法
import { Separator } from "@/components/ui/separator"<Separator />示例
垂直分隔线
使用 orientation="vertical" 来创建垂直分隔线。
Blog
Docs
Source
import { Separator } from "@/components/ui/separator"
export function SeparatorVertical() {菜单
菜单项之间带有描述的垂直分隔线。
SettingsManage preferences
AccountProfile & security
HelpSupport & docs
import { Separator } from "@/components/ui/separator"
export function SeparatorMenu() {列表
列表项之间的水平分隔线。
- Item 1
- Value 1
- Item 2
- Value 2
- Item 3
- Value 3
import { Separator } from "@/components/ui/separator"
export function SeparatorList() {API 参考
请参阅 Base UI Separator 文档。