React Bootstrap logoReact Bootstrap

Abbr

基础排版

基于 Bootstrap 5 的缩写组件,用于展示缩写或首字母缩略词,通过 title 属性在悬停时显示完整说明,支持小型大写字母样式

Component Demo

Basic usage and examples of the Abbr component

基础用法

HTML 是构建网页的标准标记语言。

缩写词样式

HTML 与 CSS 是前端开发的基础。

长说明与自定义

API 文档中通常使用 缩略词 来简化长术语,鼠标悬停即可查看完整说明。

API Documentation

Complete API reference for the Abbr component

Props

属性名类型默认值描述
asElementType'abbr'渲染的根元素类型
childrenReactNode-缩写内容
classNamestring-自定义类名
initialismbooleanfalse是否使用小型大写字母样式(.initialism),适合略长于首字母的缩写
titlestring-缩写的完整说明,悬停时以浏览器原生提示展示(透传 `title` 属性)
...restHTMLAttributes-根元素的所有原生属性

Type Definitions

AbbrProps

缩写组件属性接口

export interface AbbrProps extends HTMLAttributes<HTMLElement> {
  as?: ElementType;
  children?: ReactNode;
  className?: string;
  initialism?: boolean;
}