uniapp开发问题记录字体引入（一）

该篇博文主要是对uniapp开发遇到问题的记录，之后会逐步更新。

一、uniapp导入阿里巴巴字体库

首先在阿里巴巴矢量图标库中收集自己要的字体，专门建立一个项目，然后点击下载到本地，解压，把其中的iconfont.css拷贝到自己的项目下（可以新建一个common/css目录），然后在自己的 APP.vue中引入，然后在点击“查看在线连接”——选择Unicode，点此复制代码，把这代码复制到刚才的iconfont.css文件中，添加上https，如下图：

 

 使用：如下1在class中加入iconfont 和阿里巴巴中的font class名即可

问题： 

1.如上图中引入iconfont.css文件时必要要主要后面的分号，漏了的话会引入不进来，下面代码的颜色也变了，这是写法的问题

2.如果更新了图标，在项目中重新加入了图标，直接点击“在线连接”，他会提示有图标更新，需要更新代码，点击即可更新完后复制代码替换iconfont.css中的font-face代码。这样的话，如果我直接按class的方式（上图中的方式1）引入新加入的图标，会无效，只有按上图中的方式2，class方式和unicode方式一起用才有用，或者直接重新把字体包下载至本地，把iconfont.css文件整体替换了，再按上面步骤，替换了@font-face，再按正常方式引入图标就有用了。

 

二、手机端H5或者APP padding-right无效

如下图：在一个盒子中设置了width：100%，然后padding-right就无效了。解决办法就是给这盒子设置：box-sizing：border-box,或者去掉width：100%的设置即可。