Github Shields网站的使用#

一、网站简介#

这个网站可以实现许多徽章的生成，利于网站搭建过程中徽章的个性化

sli1

二、具体操作#

1.网站准备#

2.徽章生成#

shields徽章加入项目状态或者版本等信息，可以访问官网 Shields制作徽章
sli0

基本生成方式#

根据要求填写内容就可以生成一个简单的徽章啦~

sli2
HTML使用方式

<pic src="https://img.shields.io/badge/%E5%B0%8F%E5%AE%89-%E7%82%B9%E5%87%BB%E5%85%B3%E6%B3%A8%E6%88%91%E5%97%B7-yellowgreen"></pic>

Markdown使用方式

![效果图](https://img.shields.io/badge/小安-点击关注我嗷-yellowgreen)

下面就是生成效果啦

设置参数#

图标和图标颜色#

#添加参数logo=github #添加图标颜色logoColor=brightgreen

color

https://img.shields.io/badge/%E5%B0%8F%E5%AE%89-%E7%82%B9%E5%87%BB%E5%85%B3%E6%B3%A8%E6%88%91%E5%97%B7-yellowgreen?logo=github

https://img.shields.io/badge/%E5%B0%8F%E5%AE%89-%E7%82%B9%E5%87%BB%E5%85%B3%E6%B3%A8%E6%88%91%E5%97%B7-yellowgreen?logo=github&logoColor=brightgreen

其他图标可以借助这个网站Simple Icons

徽章样式#

icon

#样式修改
style=for-the-badge
style=social

style

https://img.shields.io/badge/%E5%B0%8F%E5%AE%89-%E7%82%B9%E5%87%BB%E5%85%B3%E6%B3%A8%E6%88%91%E5%97%B7-yellowgreen?logo=github&logoColor=brightgreen&style=for-the-badge

https://img.shields.io/badge/%E5%B0%8F%E5%AE%89-%E7%82%B9%E5%87%BB%E5%85%B3%E6%B3%A8%E6%88%91%E5%97%B7-yellowgreen?logo=github&logoColor=brightgreen&style=social

小结#

进化一下你就可以这样玩了

[![图标](https://img.shields.io/badge/%E5%B0%8F%E5%AE%89-%E7%82%B9%E5%87%BB%E5%85%B3%E6%B3%A8%E6%88%91%E5%97%B7-yellowgreen?logo=github)](https://froan.cn)

这样就可以实现链接跳转了

实际上这些参数可以直接通过修改http链接完成

更多操作到 https://shields.io/ 查阅。