最近在写一个apicloud框架开发的安卓程序,由于是个后台管理系统的页面,所以我首先要引入的是vue+elementUi

cdn引入vue.js是简单的,直接从网上找到vue.js的链接或者将内容下载到本地,通过相对路径引入都是可以的。

一定要注意:在cdn引入elementUi之前,一定要先引入vue.js才可以

cdn引入elementUi,可以查看官网上提供的cdn引入的方法

在这里插入图片描述
elementUi提供的样式中,默认的主题色是一种蓝色,但是我们公司现在的主题色是#f90,所以需要更改主题色:

cdn引入的elementUi更改主题色

更改图标字体的主题色

找到自定义主题,打开在线主题生成工具
在这里插入图片描述
在这里插入图片描述
点击颜色选择器,输入色值后,按下回车键,点击确定,即可实现主题色的切换
在这里插入图片描述
在这里插入图片描述
下载下来后,解压,是个fonts字体文件夹,因为图标的颜色也需要跟随主题色更改:
在这里插入图片描述

更改字体或者边框等的主题色

此时,仅仅是完成了字体图标主题色的更改,还需要更改其他的主题色,比如普通字体的主题色,边框的主题色,hover上去的主题色等。

此时可以通过将cdnelementUi.css打开线上链接,然后下载到本地后,批量更改主题色,已知现有的主题色是:#409eff,可以通过ctrl+H,批量实现主题色的替换操作。

将上面步骤中的fonts拷贝到elementUi.css的同级目录下,然后在页面中引入elementUi.css,否则图标不展示。

完成!!!

Logo

前往低代码交流专区

更多推荐