为Bootstrap按钮添加尺寸

前端开发教程 2025-02-04 0

为了在Bootstrap中为按钮添加大小，可以尝试以下类：

类	描述
.btn-lg	这会使按钮变大。
.btn-sm	这会使按钮变小。
.btn-xs	这会使按钮变得特别小。
.btn-block	这会创建块级按钮，即占据父元素的整个宽度。

示例

您可以尝试运行以下代码来创建一个小按钮 −

演示

<!DOCTYPE html>
<html>
   <head>
      <title>Bootstrap Example</title>  
      <meta name = viewport content = width = device-width, initial-scale = 1>
      <link rel = stylesheet href = https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css>
      <script src = https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js></script>
      <script src = https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js></script>
   </head>
   <body>
      <button type = button class = btn btn-default btn-sm>
         Small button
      </button>
   </body>
</html>

以上就是为Bootstrap按钮添加尺寸的详细内容，更多请关注双恒网络其它相关文章！

声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。