CSS: testimonial ​

div[class~="instui-testimonial"] — 带署名和可选图片的引述或推荐展示。

✅ 使用 Testimonial 场景：

  • 显示客户或用户的推荐与引言

  • 想以视觉强调突出某句话

  • 署名与上下文（姓名、职称、图片）很重要 🚫 不适用 Testimonial 的情况：

  • 在正文中显示行内引述 — 请改用块引用（blockquote）元素

  • 该陈述是主要焦点 — 请改用 Hero 或 Card

无障碍 ​

  • 语义上使用 <blockquote> 来表示引述
  • 确保署名清晰并与引述关联
  • 如果使用图片，请提供替代文本（alt）

用法 ​

css
@import "@pantoken/plugin-layouts/layouts.css";

部件 ​

部件描述
.instui-author署名：作者姓名。
.instui-avatar可选：作者头像。
.instui-content引述与署名的容器。
.instui-quote被引用的文本。
.instui-title可选：作者职称或所属单位。

状态 ​

状态描述
:optional—

消耗代币 ​

Token类型值
--instui-color-background——
--instui-color-primary——
--instui-color-surface——
--instui-color-text-primary——
--instui-color-text-secondary——
--instui-font-size-small<length>—
--instui-font-weight-semibold——
--instui-radius-medium——
--instui-space-large——
--instui-space-medium——
--instui-space-small——

相关 ​