小程序iconfont圖標引入,小程序使用背景圖。

一、小程序引入iconfont圖標。

這種方法不能引入多色圖標,多色圖標請使用圖片,或者base64轉碼引入。

  1. 阿里iconfont圖標庫中新建項目,把蒐藏的圖標保存到項目中,點擊下載到本地。
    阿里圖標庫
  2. 解壓下載的圖標文件,依次打開找到,iconfont.css文件。
    Ctrl+A全選。複製。
    iconfont圖表
  3. 在項目中新建icon.css,把剛剛複製的代碼粘貼進去。去掉沒用的部分。再在app.全局樣式引入,就可以用了。
    在這裏插入圖片描述

二、小程序引入使用背景圖片。

由於某種神祕力量,小程序並不能像平常css3屬性那樣引入本地背景圖片。
只支持,網絡圖片,base64轉碼圖片。或者image標籤定位實現。

1.網絡圖片,讓後端傳到服務器中就可以用了。

	background:url(網絡圖片)

2.base64轉碼後引入。base64轉碼網站

	background: url(data:image/png;base64,iVBORw0KGgoAAA很長一段)

3.用image標籤實現。

//僞代碼啊
.box{
		position: relative;
	}
.image{
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
	}
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章