小程序导入组件步骤和运用组件里的样式(用colorui举例)

总目录

第一步,下载组件

链接: colorUI的git下载位置.,

在这里插入图片描述

第二步,导入

把这个复制到你的项目里面
在这里插入图片描述
在这里插入图片描述

第三步,在自己项目里配置

到app.wxss里面添加

@import "colorui/main.wxss";
@import "colorui/icon.wxss";

在这里插入图片描述

第四步,如何用组件的样式

先导入你刚刚下载的组件

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
这就是coloui的项目
在这里插入图片描述

如何找到你要用的样式

在这里插入图片描述
太小了你仔细看哈哈哈哈
在这里插入图片描述

如何修改里面的样式

重写一下class里面的名字,然后再加一个样式就行了,注意这里的图标是字体不是图片,所以要用font-size来变大变小

.cuIcon-check{
    font-size: 100rpx;
}

在这里插入图片描述

题外话

我个人觉得这个组件最厉害的还是颜色组件,有渐变色

在这里插入图片描述

如何创建自己顺眼的渐变色

第一步

还是先找到你要的颜色,复制下来
在这里插入图片描述

第二步

然后找到第一个这个名字,这个名字就是这个颜色样式的样式名
在这里插入图片描述

第三步

去colorui里面的main里面找到这个样式
在这里插入图片描述

__ 用这个样式里面的gradualPink这个来搜索,gradualPink这是什么颜色的声明名,你就可以把后面的颜色改掉或者你自己写一个__
在这里插入图片描述
就改成最简单的黑白色,这是效果

在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值