• 组件
  • 布局与其它

轻量级

一种轻量级反馈/提示,可以用来显示不会打断用户操作的内容,适合用于页面转场、数据交互的等场景中。

规则

  • 一次只显示一个轻提示。
  • 有 Icon 的轻提示,字数为 4-6 个;没有 Icon 的轻提示,字数不宜超过 14 个。

代码演示

轻提示

轻提示

纯文本
加载中
成功
失败
异常
请为本次就诊评分
支付中...
支付成功
支付失败,请重试
网络异常,请重试
轻提示

全局轻提示,提供loading|success|error|wraning四种状态,引用者自行编写控制逻辑

<div class="loading-mask ">
	<div class="loading-wrapper">
		<div class="loading-msg">请为本次就诊评分</div>
	</div>
</div>
<div class="loading-mask">
	<div class="loading-wrapper">
		<div class="loading-icon loading"></div>
		<div class="loading-msg">支付中...</div>
	</div>
</div>
<div class="loading-mask ">
	<div class="loading-wrapper">
		<div class="loading-icon success"></div>
		<div class="loading-msg">支付成功</div>
	</div>
</div>
<div class="loading-mask ">
	<div class="loading-wrapper">
		<div class="loading-icon error"></div>
		<div class="loading-msg">支付失败,请重试</div>
	</div>
</div>
<div class="loading-mas">
	<div class="loading-wrapper">
		<div class="loading-icon wraning"></div>
		<div class="loading-msg">网络异常,请重试</div>
	</div>
</div>