前端资源 - 字体 - 学习/实践

客官°小女子只卖身不卖艺 2022-12-13 09:53 172阅读 0赞

1.应用场景

<table> 
 <tbody> 
  <tr> 
   <td>主要用于使用合适的字体, 进行前端项目的设计与开发.</td> 
  </tr> 
 </tbody> 
</table>

2.学习/操作

<table> 
 <tbody> 
  <tr> 
   <td> <p>1.文档/视频资源</p> <p><a href="https://search.bilibili.com/all?keyword=%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91%20%20font&amp;from_source=nav_search_new" rel="nofollow">https://search.bilibili.com/all?keyword=%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91%20%20font&amp;from_source=nav_search_new</a></p> <p>&nbsp;</p> <p>&nbsp;</p> <p>2.实践</p> 
    <table> 
     <tbody> 
      <tr> 
       <td> <p>这里以为使用某卡通字体为实践</p> <p>TBD</p> </td> 
      </tr> 
     </tbody> 
    </table><p>下载字体</p> <p><a href="https://github.com/ningxiaofa/FiraCode" rel="nofollow">https://github.com/ningxiaofa/FiraCode</a></p> <p>&nbsp;</p> <p>安装字体:</p> <p><img alt="" height="392" src="https://img-blog.csdnimg.cn/20201209141914271.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dpbGxpYW1fbg==,size_16,color_FFFFFF,t_70" width="1200"></p> <p><img alt="" height="556" src="https://img-blog.csdnimg.cn/20201209142000107.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dpbGxpYW1fbg==,size_16,color_FFFFFF,t_70" width="1091"></p> <p>查看安装的字体</p> <p><img alt="" height="484" src="https://img-blog.csdnimg.cn/20201209142234363.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dpbGxpYW1fbg==,size_16,color_FFFFFF,t_70" width="661"></p> <p>参考:</p> <p><a href="https://www.jianshu.com/p/0effae21b862" rel="nofollow">https://www.jianshu.com/p/0effae21b862</a></p> <p>&nbsp;</p> <p>&nbsp;</p> <p>&nbsp;</p> <p>后续补充</p> <p>...</p> </td> 
  </tr> 
 </tbody> 
</table>

3.问题/补充

4.参考

<table> 
 <tbody> 
  <tr> 
   <td> <p><a href="https://blog.csdn.net/william_n/article/details/108686094" rel="nofollow">https://blog.csdn.net/william_n/article/details/108686094</a>&nbsp; &nbsp;//UI - 设计 - 资源 - 收集</p> <p><a href="https://www.jianshu.com/p/0effae21b862" rel="nofollow">https://www.jianshu.com/p/0effae21b862</a></p> </td> 
  </tr> 
 </tbody> 
</table>

后续补充

...