參考網址:
下載圖形檔案
https://github.com/twbs/icons/releases/download/v1.6.0/bootstrap-icons-1.6.0.zip
將檔案解壓縮複製到class/assets/bootstrap/css/bootstrap-icons目錄下
下載CSS檔案
https://cdn.jsdelivr.net/npm/bootstrap-icons@1.6.0/font/bootstrap-icons.css
將檔案放到class/assets/bootstrap/css目錄下
修改檔案上方的url
@font-face { font-family: "bootstrap-icons"; src: url("./bootstrap-icons/fonts/bootstrap-icons.woff2?45695e8b569b2b0178db2713ca47065c") format("woff2"), url("./bootstrap-icons/fonts/bootstrap-icons.woff?45695e8b569b2b0178db2713ca47065c") format("woff"); }
網頁中要
<link rel="stylesheet" href="/{{ $theme.web_name }}/class/assets/bootstrap/css/bootstrap-icons.css">
有多種使用方法,請參考 https://icons.getbootstrap.com/#usage
最常用的是當Icon fonts用
<i class="bi-alarm"></i>
<i class="bi-alarm" style="font-size: 2rem; color: cornflowerblue;"></i>