[bootstrap]icons安裝至本機目錄

參考網址:

下載圖形檔案

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>

 

 

 

本篇發表於 程式設計。將永久鏈結加入書籤。