bootstrap rounded

Bootstrap 是一个流行的前端框架,它提供了多种类来帮助开发者快速实现响应式和美观的网页设计。在 Bootstrap 中,rounded 是用来给元素添加圆角的 CSS 类。

以下是一些常用的圆角类:

  • .rounded:给元素的每个角添加一个小圆角。
  • .rounded-top:只给元素的顶部两个角添加圆角。
  • .rounded-right:只给元素的右侧两个角添加圆角。
  • .rounded-bottom:只给元素的底部两个角添加圆角。
  • .rounded-left:只给元素的左侧两个角添加圆角。
  • .rounded-circle:使元素的每个角都完全圆,形成一个圆形。
  • .rounded-pill:给元素的每个角添加一个大圆角,使其看起来像一个药丸形状。

你可以将这些类添加到任何 HTML 元素上,以改变其外观。例如:

<!-- 给按钮添加圆角 -->
<button class="btn btn-primary rounded">按钮</button>

<!-- 只给按钮的顶部添加圆角 -->
<button class="btn btn-secondary rounded-top">按钮</button>

<!-- 使按钮看起来像一个圆形 -->
<button class="btn btn-success rounded-circle">确定</button>

请注意,Bootstrap 的版本可能会影响可用的类和它们的行为。上述类在 Bootstrap 4 和 Bootstrap 5 中都是可用的,

但是在 Bootstrap 3 中,圆角类的命名可能略有不同。

如果你使用的是 Bootstrap 3,可以使用 .rounded.rounded-top.rounded-right.rounded-bottom.rounded-left 类,但 .rounded-circle.rounded-pill 类是不可用的。

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注