elementUI-添加自定义图标
生活随笔
收集整理的這篇文章主要介紹了
elementUI-添加自定义图标
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
elementui的小圖標(biāo)有限,跟UI給的不一樣,這個(gè)時(shí)候咋辦呢?百度走起。。。。參考了兩篇博主分享的 自定義elementui中的圖標(biāo) 和 建立圖標(biāo)庫,這里主要用到第一種
實(shí)際中:
elementUI導(dǎo)航欄
具體代碼:
//自定義圖標(biāo)名el-icon-my- .el-icon-my-statistic{background: url("./imgs/statistics_icon_nor.png") center no-repeat; }//content中是中文的Unicode編碼; font-size:圖標(biāo)大小; visibility: hidden;來隱藏文字 .el-icon-my-statistic:before{content: "\8d3a";font-size: 14px;visibility: hidden; }補(bǔ)充
漢字轉(zhuǎn)換Unicode編碼:
直接打開控制臺(tái): 漢字.charCodeAt().toString(16); 然后回車;
至于三角形的圖標(biāo),我直接把箭頭的 unicode 值改成了 三角形的 Unicode 值。
/* 上三角\e78f , 下三角\e790*/ aside ul#myAside .el-icon-arrow-down:before {content: "\e78f" !important; }總結(jié)
以上是生活随笔為你收集整理的elementUI-添加自定义图标的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: console.log打印没有效果
- 下一篇: echarts(一)下载引入,调色盘,[