github的README上加入标签/图像链接/badges
作者：互联网
文章目录
1. 炫酷的标签
1.1 常见标签
1. Open in Colab
[](https://colab.research.google.com/github/bipinKrishnan/fastai_course/blob/master/bear_classifier.ipynb)
其实语法很简单，就是将显示图像作为链接名称（图像就直接是colab的图标），后面再跟上对应的链接目标
2. Binder
[](https://mybinder.org/v2/gh/bipinKrishnan/fastai_course/master)
结构同上。
3. 多个标签并列
这时候需要使用一点前端的小知识
<p>
<a href="https://github.com/zhanghang1989?tab=followers"> <img src="https://img.shields.io/github/followers/zhanghang1989?label=Followers&style=plastic" height="25px" alt="github follow" /> </a>
<a href="https://hangzhang.org/"> <img src="https://img.shields.io/badge/ℋ-homepage-3875B7.svg?labelColor=21438A&style=plastic" height="25px" alt="Hang Zhang">
<a href="https://scholar.google.com/citations?user=gCoWdkUAAAAJ"><img src="https://img.shields.io/badge/scholar-4385FE.svg?&style=plastic&logo=google-scholar&logoColor=white" alt="Google Scholar" height="25px"> </a>
<a href="mailto:zhang.hang@rutgers.edu"> <img src="https://img.shields.io/badge/gmail-%23D14836.svg?&style=plastic&logo=gmail&logoColor=white" height="25px" alt="Email">
<a href="https://www.linkedin.com/in/zhanghang0704/"><img src="https://img.shields.io/badge/linkedin-006CAC.svg?&style=plastic&logo=linkedin&logoColor=white" height="25px" alt="LinkedIn"> </a>
<a href="https://www.zhihu.com/people/zhanghang0704"><img src="https://img.shields.io/badge/知乎-0079FF.svg?style=plastic&logo=zhihu&logoColor=white" height="25px" alt="知乎"></a>
<a href="https://hangzhang.org/cvHangZhang/cvHangZhang.pdf"> <img src="https://img.shields.io/badge/-CV-black?style=plastic" height="25px"> </a>
</p>
只要把链接改成自己对应的账号url链接就行，这里使用a标签，是为了让标签大小可调节。如果无所谓这个东西的话，其实还是直接使用markdown语法来实现(但是很诡异，如果使用markdown的语法，会显示 外链图片无法转存。。。那就还是使用这种html的标签写法好了)
4. awesome标签
html的方式，如下
<a href="https://github.com/sindresorhus/123"><img src="https://camo.githubusercontent.com/abb97269de2982c379cbc128bba93ba724d8822bfbe082737772bd4feb59cb54/68747470733a2f2f63646e2e7261776769742e636f6d2f73696e647265736f726875732f617765736f6d652f643733303566333864323966656437386661383536353265336136336531353464643865383832392f6d656469612f62616467652e737667"></a>
markdown的方式，如下：
[](https://github.com/sindresorhus/awesome)
5. 开源协议标签
html的写法：
<a href="https://creativecommons.org/licenses/by/4.0/"><img src="https://camo.githubusercontent.com/bca967b18143b8a5b2ffe78bd4a1a30f6bc21de83bd8336f748e96498af38b38/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f4c6963656e73652d43432532304259253230342e302d6c69676874677265792e737667
"></a>
其实最关键的地方是，如何去寻找这些标签的图像位置。。
6. 文档版本
html的写法：
<a href="https://creativecommons.org/licenses/by/4.0/"><img src="https://camo.githubusercontent.com/33126b4770aa6f169b2a93e75678d52647f19972fa8d205e478049966e3b1a07/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f646f63732d737461626c652d627269676874677265656e2e7376673f7374796c653d666c6174266c6f6e6743616368653d74727565
"></a>
7. python语言版本
html写法
<a href="https://github.com/allegroai/clearml"><img src="https://camo.githubusercontent.com/f60861e75a851f69a1fb8a5c671ef233147b7781a13dae226dcc2c32166654c0/68747470733a2f2f696d672e736869656c64732e696f2f707970692f707976657273696f6e732f636c6561726d6c2e737667
"></a>
1.2 标签图像来源
其实稍微观察一下，就知道上面这些公用标签，很多都来自于：https://camo.githubusercontent.com这个网址。可惜打不开，改变搜索方式，
得到关于Camo的信息，包括以下链接：
但是这似乎只是一种保证图像可以及时更新/同步的方式。
感谢：GitHub Action to clear cache on Images in README
终于找到这些链接的正确名称了，不是tags，也不是images，而是badges
进而搜索找到了正确的位置：
2. 所有标签
2.1 标签列表
参考这两个网页： 150+ Badges for GitHub 和 github-badges/shields
其中，shields这个组织自主维护了github的badges图像服务，帮助人们快速找到/生成自己想要的badges图像。（所以可以看到下面的图像链接都是shields来源，而上面都是camo.githubusercontent来源）
只需要把图像链接改成对应的badges的url即可
<a><img src="https://img.shields.io/badge/WhatsApp-25D366?style=for-the-badge&logo=whatsapp&logoColor=white
"></a>
上面代码显示为（没加链接，不会跳转，就是个图）:
为了防止有些人喷我抄袭，这里只放几个示意的截图，想要看全部和直接复制url链接的，还是去源链接（不要喷我抄袭，我标明了参考来源，我就是转运！！！搬运工！！！）
对应的github项目地址为：https://github.com/Envoy-VC/Badges-for-GitHub
标签：github,标签,https,README,com,链接,badges 来源： https://blog.csdn.net/Castlehe/article/details/122494799