Bootstrap 简明教程

Bootstrap - Badges demo

What is a badge?

徽章是一种小内联元素,用于突出显示或标记某些信息。它通常显示为包含数字或文本的小圆圈或矩形。它们在视觉上突出显示重要信息或在 Web 应用程序中提供快速状态更新。

A badge is a small inline element used to highlight or label certain information. It is typically displayed as a small circle or rectangle containing a number or text. They visually highlight important information or provide quick status updates within your web application.

Bootstrap 类用于在 <html> 元素中添加徽章,该类为 .badge

The Bootstrap classes that is used to add a badge in <html> element is .badge.

可用于自定义徽章的其他类包括:

Other classes that can be used to cutomize the badges are:

  1. color utility classes such as .bg-, .text-bg-**

  2. positioning classes such as .position-absolute

  3. pill badges through .rounded-pill utility class

以下是徽章的一些示例:

Some of the examples for badges are as follows:

Example

Description

Download link

This example shows the structure of badges and various other classes that can be applied to them in Bootstrap

Download