webpack學習《08字型模組的安裝》

2021-10-08 22:09:58 字數 841 閱讀 5824

在bootstrap中有字型的元件,如下圖所示,現在演示如何匯入bootstrap中的字型圖示

輸入命令字段:

npm i bootstrap@3這裡表示安裝3.x版本的bootstrap第三方模組,最新的是4.x版本,但是在字型元件這塊,由於4.x字型包與css樣式程式碼是分開的。需要安裝兩個包。這裡就演示用3.x版的bootstrap,所以我就安裝3.x版本的

同樣是在webpack.config.js檔案中,進行配置。

module:,,

//如下就是配置bootstrap字型元件的設定,前面test表示檔案的過濾,use表示需要使用url-loader第三方工具]}

}

需要在main.js中匯入模組。

然後再html中span的標籤中記錄class類名。

啟動我們的npm run dev 打包命令。如下圖就顯示出我們的圖示。

CSS學習3(字型)

這是最亂的地方,幾乎所有的字型都有多種名字。同種字型的不同風格 斜體,加粗等等 也有不同的名字,為了解決這個問題,css使用font family表示乙個系列的字型,包括這種字型的各個風格。設定時,你可以指定字型系列,也可以指定特定的字型。字型可以設定多個,使用者 會依次查詢,直到找到第乙個可用的為...

css學習筆記20160117字型

css主要設定設定字型的字型樣式大小 font family設定字型系列.屬性值如果超出了乙個字要用雙引號包圍,例如 times new roman 多個屬性值之間用逗號分割,當瀏覽器找不到第乙個字型時會依次向下尋找字型.如果找不到會在通用自體裡面使用相似的字型.font style屬性定義了字型樣...

05 字型標籤

粗體粗體creation of webpage creation of webpage creation of webpage creation of webpage creation of webpage creation of webpage creation of webpage creati...