【工具系列】为你的项目制作 Shields 徽章

框架师

发布于 2022-11-30 16:27:45

8950

发布于 2022-11-30 16:27:45

文章被收录于专栏：墨白的Java基地墨白的Java基地

前言

在 GitHub 许多开源项目都有很漂亮的徽章，它们可以用来显示项目的进度，访问人数，版本信息以及 GitHub stars 数量等等，比如 kjs-common 这个项目

自定义徽章

shields 徽章可用来说明项目状态或者版本等信息，可以访问官网 https://www.shields.io/ 制作徽章，

找到 Your BADGE 自定义定制徽章，输入标签和信息，点击生成：

效果

在 markdown 可以使用 html 语法显示图标

<a href="https://tencent.cos.mobaijun.com/img/icon/avatar.jpg"><img src="https://img.shields.io/badge/%E6%A1%86%E6%9E%B6%E5%B8%88-%E5%A2%A8%E7%99%BD-green" alt="博客"></a>

也可以直接编辑 URL：

https://img.shields.io/badge/<LABEL>-<MESSAGE>-<COLOR>.svg
# 或者
https://img.shields.io/static/v1?label=<LABEL>&message=<MESSAGE>&color=<COLOR>

参数设置

有以下几种颜色可以选择：

brightgreen、green、yellow、green、yellow、orange、red、blue、lightgrey、success、important、critical、informational、inactive、blueviolet、ff69b4、9cf

还可以配置 style 和 logo 参数

https://img.shields.io/badge/%E6%A1%86%E6%9E%B6%E5%B8%88-%E5%A2%A8%E7%99%BD-green?style=social&logo=github

style 样式默认为 flat，还可以设置为 plastic、flat-square、for-the-badge 和 social。 logo 可以选择 Simple Icons：https://simpleicons.org 上提供的图标，比如微信的图标：

logo=WeChat

其他

更多玩法可到 https://shields.io/ 查阅。

设置链接

可以给徽章设置一个链接

[![](https://img.shields.io/badge/%E6%A1%86%E6%9E%B6%E5%B8%88-%E5%A2%A8%E7%99%BD-green?style=social&logo=github)](https://www.mobaijun.com)

或者使用 HTML 语法：

<p align="center">
<a href="https://www.mobaijun.com"><img src="https://img.shields.io/badge/%E6%A1%86%E6%9E%B6%E5%B8%88-%E5%A2%A8%E7%99%BD-green?style=social&logo=github" alt=""></a>
</p>

本文参与腾讯云自媒体分享计划，分享自作者个人站点/博客。

原始发表：2022-11-24，如有侵权请联系 cloudcommunity@tencent.com 删除

https