跨平台应用开发进阶(十五) ：uni-app实现全项目字体替换

文章目录

一、前言
二、实现
三、拓展阅读

一、前言

uni-app项目开发过程中，到了后期，客户采购一套字体用于项目中，为此需要考虑项目按照标准进行整体替换。考虑到公共样式与单页面样式，工作量并不小。

二、实现

将字体的包体存入在static文件夹下。

在app.js中引入

@font-face {font-family: my-font;src: url('~@/static/Times New Roman.ttf');
}

最后在页面中正常使用就行了。

.content {overflow: hidden;position: relative;background: url(../../static/bg.png);background-size: 100% 100%;width: 100vw;height:calc(1080px - 143px);font-family:Times New Roman;margin: 0 auto;}

三、拓展阅读

《Cross-platform APP 专栏》

跨平台应用开发进阶(十五) ：uni-app实现全项目字体替换相关推荐

跨平台应用开发进阶(十二) ：uni-app 实现应用桌面图标角标提示及应用跳转
文章目录一.前言二.实现 2.1 集成极光实现 2.1.1 通道支持 2.1.2 iOS 角标 2.1.3 华为角标 2.1.4 小米角标 2.1.5 vivo 角标 2.2 H5+实现三.遇到 ...
跨平台应用开发进阶(八) ：uni-app 实现Android原生APP-云打包集成极光推送(JG-JPUSH)详细教程
文章目录一.前言二.资源三.集成 3.1 SDK 引入 3.2 代码集成 3.3 遇到的问题及解决方案 3.3.1 包大小限制 3.3.2 [JS Framework] 当前运行的基座不包含原生 ...
跨平台应用开发进阶(三十八)uni-app前端监控方案：基调听云APP探究
文章目录一.前言二.产品介绍 2.1 工作原理 2.1.1 Android平台工作原理 2.1.2 iOS平台工作原理三.项目集成 3.1 Android集成 3.2 iOS集成四.答疑解惑 ...
跨平台应用开发进阶(三十)：uni-app 实现集成火山视频直播服务
文章目录一.前言二.技术实现 2.1 web-view组件在app中的窗体关系和plus.webview操作方式三.双向通信 3.1 uni-app与内嵌网页通信 3.2 内嵌网页向uni-ap ...
跨平台应用开发进阶(四十六)webview方式嵌套H5应用加载慢解决方案
文章目录一.前言二.优化建议三.实施方案 3.1 优化项目结构,减小项目组包体积 3.2 去除项目冗余字体文件 3.2.1 字体筛选 3.2.2 字体压缩 3.3 gzip压缩 3.4 ETag ...
跨平台应用开发进阶(四十三)一文走近网络层抓包工具：WhireShark
文章目录一.前言二.条件过滤三.字段含义四.TCP连接 4.1 三次握手示例五.色彩规则六.分析方法 6.1 Packet size limited during capture 6.2 ...
跨平台应用开发进阶(四十一)使用Xcode打包 iOS 应用 archive 时四种证书的区别详解
文章目录一.archive 四种模式二.相同点三.安装方式区别四.iOS开发者账号(企业版)申请攻略 4.1 苹果开发者账号类型 4.2 企业版开发者账号的优势是什么? 4.3 企业版开发者账 ...
跨平台应用开发进阶(十一) ：uni-app 实现IOS原生APP-云打包集成极光推送(JG-JPUSH)详细教程
文章目录一.前言二.资源三.集成四.遇到的问题及解决措施 4.1 IOS开发者证书无推送权限 4.2 manifest中并没有配置push模块.但云端打包ios就是一直报Code Signin ...
跨平台应用开发进阶(六十一)：uni-app 跨平台技术开发框架可行性调研
文章目录一.流程类二.研发类(uni-app框架) 三.心得分享(研发踩坑&uni-app踩坑) 四.拓展阅读一.流程类 IOS和安卓企业开发者账户申请流程(申请渠道.需要提供的相关证明 ...

跨平台应用开发进阶(十五) ：uni-app实现全项目字体替换

文章目录

一、前言

二、实现

三、拓展阅读

跨平台应用开发进阶(十五) ：uni-app实现全项目字体替换相关推荐

最新文章

热门文章