骨架
骨架组件是一个可以用来显示组件加载状态的组件。
| 类名 | 类型 | |
|---|---|---|
| skeleton | 组件 | 带有加载动画的占位符 div |
<div class="$$skeleton h-32 w-32"></div>
<div class="$$skeleton h-32 w-32"></div>
<div class="$$skeleton h-32 w-32"></div>
<div class="$$skeleton h-32 w-32"></div><div class="flex w-52 flex-col gap-4"> <div class="flex items-center gap-4"> <div class="$$skeleton h-16 w-16 shrink-0 rounded-full"></div> <div class="flex flex-col gap-4"> <div class="$$skeleton h-4 w-20"></div> <div class="$$skeleton h-4 w-28"></div> </div> </div> <div class="$$skeleton h-32 w-full"></div> </div>
<div class="flex w-52 flex-col gap-4">
<div class="flex items-center gap-4">
<div class="$$skeleton h-16 w-16 shrink-0 rounded-full"></div>
<div class="flex flex-col gap-4">
<div class="$$skeleton h-4 w-20"></div>
<div class="$$skeleton h-4 w-28"></div>
</div>
</div>
<div class="$$skeleton h-32 w-full"></div>
</div>
<div class="flex w-52 flex-col gap-4">
<div class="flex items-center gap-4">
<div class="$$skeleton h-16 w-16 shrink-0 rounded-full"></div>
<div class="flex flex-col gap-4">
<div class="$$skeleton h-4 w-20"></div>
<div class="$$skeleton h-4 w-28"></div>
</div>
</div>
<div class="$$skeleton h-32 w-full"></div>
</div>
<div class="flex w-52 flex-col gap-4">
<div class="flex items-center gap-4">
<div class="$$skeleton h-16 w-16 shrink-0 rounded-full"></div>
<div class="flex flex-col gap-4">
<div class="$$skeleton h-4 w-20"></div>
<div class="$$skeleton h-4 w-28"></div>
</div>
</div>
<div class="$$skeleton h-32 w-full"></div>
</div><div class="flex w-52 flex-col gap-4"> <div class="$$skeleton h-32 w-full"></div> <div class="$$skeleton h-4 w-28"></div> <div class="$$skeleton h-4 w-full"></div> <div class="$$skeleton h-4 w-full"></div> </div>
<div class="flex w-52 flex-col gap-4">
<div class="$$skeleton h-32 w-full"></div>
<div class="$$skeleton h-4 w-28"></div>
<div class="$$skeleton h-4 w-full"></div>
<div class="$$skeleton h-4 w-full"></div>
</div>
<div class="flex w-52 flex-col gap-4">
<div class="$$skeleton h-32 w-full"></div>
<div class="$$skeleton h-4 w-28"></div>
<div class="$$skeleton h-4 w-full"></div>
<div class="$$skeleton h-4 w-full"></div>
</div>
<div class="flex w-52 flex-col gap-4">
<div class="$$skeleton h-32 w-full"></div>
<div class="$$skeleton h-4 w-28"></div>
<div class="$$skeleton h-4 w-full"></div>
<div class="$$skeleton h-4 w-full"></div>
</div>您有问题吗？ 在 GitHub 上提问 或 Discord 服务器
您发现 Bug 了吗？ 在 GitHub 上提交 issue
您喜欢 daisyUI 吗？ 发帖宣传一下！
支持 daisyUI 的开发： Open Collective
