Bootstrap 按钮填充未加载

Question

我正在尝试让一些按钮在 Bootstrap 5:

中工作

<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.0/css/bootstrap.min.css" rel="stylesheet" />

<div class="container-fluid">
  <div class="row">
    <div class="col-12">
      <a class="btn-primary">0000</a>
      <button class="btn-primary">0000</button>
    </div>
  </div>
</div>

但是样式应用不正确，按钮似乎缺少圆角和填充：

我只从 <link href="css/bootstrap.min.css" rel="stylesheet"> 加载样式，我很确定这是我一直做的。

Answer 1

需要 btn 与其他习俗保持一致 bootstrap 类。在此处了解 buttons

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet"/>

<div class="container-fluid">
    <div class="row">
        <div class="col-12">
            <a class="btn btn-primary">0000</a>
            <button class="btn btn-primary">0000</button>
        </div>
    </div>
</div>

Answer 2

它错过了“btn”class。

<a href="#" class="btn btn-primary">asdasda</a>

Answer 3

你忘了 btn class

<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.0/css/bootstrap.min.css" rel="stylesheet" />

<div class="container-fluid">
  <div class="row">
    <div class="col-12">
      <a class="btn btn-primary" role="button">0000</a>
      <button class="btn btn-primary">0000</button>
    </div>
  </div>
</div>

https://getbootstrap.com/docs/4.5/components/buttons/

Bootstrap includes several predefined button styles, each serving its own semantic purpose, with a few extras thrown in for more control.

Button tags

The .btn classes are designed to be used with the <button> element. However, you can also use these classes on <a> or <input> elements (though some browsers may apply a slightly different rendering).

When using button classes on <a> elements that are used to trigger in-page functionality (like collapsing content), rather than linking to new pages or sections within the current page, these links should be given a role="button" to appropriately convey their purpose to assistive technologies such as screen readers.

Answer 4

将 class class="btn-primary" 更改为 class="btn btn-primary"

Bootstrap 按钮填充未加载

Bootstrap button padding not loading

html

css

padding

twitter-bootstrap