uniapp开发——引入官方uni.css库,iconfont图标库和animate动画库

uniapp有一个官方的css库——uni.css,配合代码块,编码如同德芙一样丝滑,(官方示例中有,不用下载,复制来用即可)

自定义图标库——iconfont(登录iconfont,创建项目,把文件下载下来,解压只要iconfont.css,注意,里面有些东西要删除)

uniapp开发——引入官方uni.css库,iconfont图标库和animate动画库_第1张图片

黄色方框圈出的,要删;因为.eot那些加载不了

uniapp开发——引入官方uni.css库,iconfont图标库和animate动画库_第2张图片

删完后是这样

uniapp开发——引入官方uni.css库,iconfont图标库和animate动画库_第3张图片

 

css动画库——animate.css(官网下载https://daneden.github.io/animate.css/)

如图,先把三个文件分别下载到uniapp项目的common文件夹,然后在App.vue中引入

uniapp开发——引入官方uni.css库,iconfont图标库和animate动画库_第4张图片

然后就可以使用了,

 uni.css用法: 直接敲u就有代码提示

iconfont和animate用法:

打开从icofont下载来的文件(此文章第一张图有),里面有个demo_index.html文件,可以看到class代码,

如图,左边黄框是iconfont用法,右边红框是animate用法

uniapp开发——引入官方uni.css库,iconfont图标库和animate动画库_第5张图片

你可能感兴趣的:(前端,uni.css,uniapp,iconfont,animate)