首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >【Uni-App社区小程序】004-引入官方CSS样式库

【Uni-App社区小程序】004-引入官方CSS样式库

作者头像
訾博ZiBo
发布于 2025-01-06 07:19:45
发布于 2025-01-06 07:19:45
4470
举报

一、获取官方CSS样式库文件

第一步:在空白处,鼠标右键新建项目
第二步:创建一个官方的演示项目,如图
第三步:创建成功,官方CSS样式库位置如图

二、引入官方CSS样式库

第一步:在我们的项目中新建文件夹
第二步:输入文件名,按键盘上的回车键(Enter)即可
第三步:将官方CSS样式库复制到common文件夹
第四步:引入官方CSS样式库文件,并复制uni.ttf文件,即可
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2025-01-06,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
【Uni-App社区小程序】005-引入自定义图标库
Iconfont-国内功能很强大且图标内容很丰富的矢量图标库,提供矢量图标下载、在线存储、格式转换等功能;
訾博ZiBo
2025/01/06
3520
【Uni-App社区小程序】005-引入自定义图标库
【Uni-App社区小程序】002-创建项目
訾博ZiBo
2025/01/06
1010
【Uni-App社区小程序】002-创建项目
保姆级教程:写出自己的移动应用和小程序(篇一)
工欲善其事必先利其器,一个 Mac 设备必不可少( iMac、MacBook皆可),接下来下载最新版本的 Xcode 作为 iOS 开发的IDE(Integrated Development Environment ,集成开发环境,就是编辑、编译、链接、调试统统包含的一揽子开发环境,移动开发的 IDE 一般还会包含移动设备的模拟器)。
火爆的小茶壶
2022/07/26
1.2K0
保姆级教程:写出自己的移动应用和小程序(篇一)
Uni-App项目搭建以及准备工作
Uni-App项目开发,需要“定制化IDE”,也就是“HBuilderX”工具,主要是因为模拟运行调试一块,其他IDE不具备,其他功能和VS code、Submit Text 基本一致。
Javanx
2019/09/04
2.8K0
Uni-App项目搭建以及准备工作
引入官方uni.css样式
对于css样式不熟练的我发现uni-app的demo中有很多类似uni-row的样式,不过需要先引入到自己的项目中。下面为具体步骤
听着music睡
2022/05/07
1.4K0
引入官方uni.css样式
【Uni-App社区小程序】006-引入CSS动画库
Animate.css是一个有趣的,跨浏览器的css3动画库,预设了抖动(shake)、闪烁(flash)、弹跳(bounce)、翻转(flip)、旋转(rotateIn/rotateOut)、淡入淡出(fadeIn/fadeOut)等多达 60 多种动画效果,几乎包含了所有常见的动画效果;
訾博ZiBo
2025/01/06
1820
【Uni-App社区小程序】006-引入CSS动画库
【Vite基础】002-Vite 中使用 CSS 的各种功能
CSS 模块是一个CSS 文件,默认情况下,所有类名和动画名都在本地范围内。所有 URL ( url(...))@imports都采用模块请求格式(./xxx并且../xxx表示相对的,xxx表示xxx/yyy在模块文件夹中,即在 中node_modules)。
訾博ZiBo
2025/01/06
3460
【Vite基础】002-Vite 中使用 CSS 的各种功能
关于在angular2及以上版本引入bootstrap 并有提示功能
花了一些时间来研究关于angular2及以上版本引入bootstrap 并有提示功能 如果按照正常来的话:在angular2中引入bootstrap,没有提示功能的: 第一步:cnpm install bootstrap --save; 第二步:cnpm install @types/bootstrap --save-dev; 第三步:找到angular/cli 在styles中添加     ../nodu_modules..............bootstrap.min.css 路径. 这样便可以在组
杭州前端工程师
2018/06/15
5980
uni-app 之登录页面
学习了一周多uni-app,上一周主要是开发原生插件给uni-app调用。本周开始学习怎么使用uni-app写页面。学过vue的同学应该是毫无压力。原生开发的同学就有点吃力了。需要学一些vue基础才能开发。 开发iOS原生插件这有一篇不错的文章可以参考 uni-app 原生插件开发04 - 开发原生插件 uni原生插件开发教程
赵哥窟
2021/12/16
2.7K0
uni-app 之登录页面
【Uni-App社区小程序】001-环境搭建
备注:官方教程有个js-beauty插件,但是核心插件里面没有,插件市场我也没找到,因此暂时没有安装,以后用到出错再解决;
訾博ZiBo
2025/01/06
1090
【Uni-App社区小程序】001-环境搭建
微信小程序开发入门篇
官方下载地址:https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html
乱码三千
2021/07/29
7390
微信小程序开发入门篇
uni-app使用iconfont自定义图标
1.注册阿里巴巴图标矢量库账号 2.选择顶部菜单图标管理-我的项目后新建项目 3.在新建的项目中添加自己喜欢的图标 4.点击查看在线链接,获取在线图标链接代码
薛定喵君
2020/02/25
4.6K0
uni-app使用iconfont自定义图标
微信小程序转化为uni-app项目
  之前自己做一个uni-app的项目的时候前端需要实现一个比较复杂的动态tab和swiper切换的功能,但是由于自己前端抠脚的原因没有写出来,然后自己在网上搜索的时候发现了有个微信小程序里面的页面及极其的符合我的需求。那么问题来了我该如何将微信小程序转为为uni-app项目呢?搜索了下网上的相关解决方案还真有个将微信小程序转化为uni-app的项目,该项目名称叫做【miniprogram-to-uniapp】,接下来就看看如何实操吧!
追逐时光者
2020/06/19
1.8K0
微信小程序转化为uni-app项目
vue中使用iconfont
第一步: 进入官网,注册--登录 阿里巴巴矢量库 第二步: 图标管理---我的项目--创建项目---新建 新建项目 第三步: 进入图标库--官方图标库 开始选择图标 第四步:选中图标-- 添加入库--
用户4344670
2019/08/28
1.2K0
vue中使用iconfont
阿里图标库引入图标
比wordpress默认图表库的图标好看多的 默认图标库的图标一般都是灰白色简直难看死了哈哈 今天分享给大家如何插入阿里图标库的彩色图标 阿里图标库有什么好处呢 插入方便 图标样式多 彩色图标应有尽有 反正你用都用不完 重点还永久免费使用
傲绝
2023/03/13
3.1K0
阿里图标库引入图标
E029Web学习笔记-Maven基础
Maven将Java项目所需要的Jar包放在一个统一的仓库里面,多个项目可以共同使用;
訾博ZiBo
2025/01/06
1030
E029Web学习笔记-Maven基础
Windows 和 Linux 上安装 TTF 字体的方法
其实,我们一开始考虑的方案是将字体文件安装在运行项目的每台客户机上,但是,因为使用项目的客户机实在太多,每台都装的话太过繁琐,所以就采用了文件引用的方式。
编程三昧
2022/01/31
6.7K0
Windows 和 Linux 上安装 TTF 字体的方法
【Uni-App社区小程序】008-底部导航
https://uniapp.dcloud.net.cn/collocation/pages?id=tabbar
訾博ZiBo
2025/01/06
1610
【Uni-App社区小程序】008-底部导航
【Uni-App社区小程序】003-多端调试环境配置
(由于本人使用的是基于Android系统的荣耀20手机,没有也从未使用过基于IOS系统的苹果手机,这里暂不做演示,请见谅!但真机调试的方法一般都不是太复杂,有需要的朋友可通过百度搜索,按照常规真机调试步骤进行相关操作。)
訾博ZiBo
2025/01/06
5550
【Uni-App社区小程序】003-多端调试环境配置
uni-app实战之社区交友APP(2)全局样式引入和底部导航栏开发
本文先介绍了uni-app项目中引入全局样式的种类,即App.vue中引入官方CSS样式库、自定义图标库和CSS动画库;再介绍了在pages.json中定义globalStyle;最后实现了项目的导航栏开发。
cutercorley
2021/01/26
3.1K0
uni-app实战之社区交友APP(2)全局样式引入和底部导航栏开发
相关推荐
【Uni-App社区小程序】005-引入自定义图标库
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档