#3132·layui

[empty] 添加 Empty 空状态组件

作者: sunxiaobin89创建于 2026年8月11日更新于 2026年9月14日

HTML structure: lay-empty (root) → lay-empty-icon (icon, displayed by default when empty) / lay-empty-text (main text) / lay-empty-description (optional description) / lay-empty-action (optional action area).
CSS highlights: full use of CSS variables: --lay-gray-500/600/700, --lay-spacing-*, component-level adjustable variables --lay-empty-icon-size and so on.
Built-in icon is injected by font icon (content: '\e621') through .lay-empty-icon:empty::before, automatically displaying the default icon when the container is empty, and hiding it when custom content is added, achieving "built-in + customizable".
No state classes, no size variants, and keeping the minimum size.

内容来源: layui/layui