• 這篇介紹Bootstrap裡面的Button的樣式，裡面的button有非常多種功能、樣式、格式、標籤、狀態、尺寸等等各式各樣的功能，這篇會把其重點整理如下。
• 幾個基本的範例，程式碼如下:
  

<button type="button" class="btn btn-primary">Primary</button>
<button type="button" class="btn btn-secondary">Secondary</button>
<button type="button" class="btn btn-success">Success</button>
<button type="button" class="btn btn-danger">Danger</button>
<button type="button" class="btn btn-warning">Warning</button>
<button type="button" class="btn btn-info">Info</button>
<button type="button" class="btn btn-light">Light</button>
<button type="button" class="btn btn-dark">Dark</button>
<button type="button" class="btn btn-link">Link</button>

• btn-lg &btn-sm可以調整按鈕大小:
  

• 不用使用<button>也可以做出與<button>一樣的樣式，例如:

    <a class="btn btn-primary btn-lg" href="#" role="button">Link</a>
    <button class="btn btn-primary btn-lg" type="submit">Button</button>
    <input class="btn btn-primary btn-lg" type="button" value="Input">
    <input class="btn btn-primary btn-lg" type="submit" value="Submit">
    <input class="btn btn-primary btn-lg" btn-lg type="reset" value="Reset">

• 還有.btn-outline-*可以使用，效果如下:
  
• button裡面有一個disabled的功能，bootstrap也可以做到禁用的功能，效果如下:

<button type="button" class="btn btn-outline-success disabled">Success</button>

• 使用grid的gap可以使button樣式更好看如下:

<div class="d-grid gap-2">
  <button class="btn btn-primary" type="button">Button</button>
  <button class="btn btn-primary" type="button">Button</button>
</div>

• 按鈕有一種樣式是切換的data-bs-toggle="button"，點一下開啟，再點一下關閉，如下圖:
  
• 以上就是bootstrap的button的幾種樣式介紹。