- 你可能看到过这种小尾巴:
- 仔细观察,就会发现其是在这个网站制作的:
https://readme-typing-svg.demolab.com/ - 那么,既然可以基于 SVG 显示动态文字,为什么不试试静态文字呢?
- 注: 动态文字 SVG 使用 JavaScript 实现,也就是说其实是在客户端渲染。
本质上与徽章小尾巴无异。
- 没错,这段文字完全没有动。或者说……基本上没有动?
仔细看看参数:
<img src="https://readme-typing-svg.demolab.com?font=Fira+Code&duration=0.1&color=F796F2EE&repeat=false&width=435&lines=%E5%B0%8F%E7%84%B0%E2%80%A6%E2%80%A6%E7%BB%88%E4%BA%8E%E5%8F%AB%E6%88%91%E7%9A%84%E5%90%8D%E5%AD%97%E4%BA%86%E5%91%A2%E2%80%A6%E2%80%A6%E5%A5%BD%E5%BC%80%E5%BF%83%E5%95%8A%E2%80%A6%E2%80%A6"></img>
- 没错,你会发现一个
duration=0.1
,也就是在每个文字显示之前停顿 0.1ms。
嗯,0.1 毫秒,基本上可以忽略不计了。
除此之外,本域名在中国大陆访问几乎完全没有障碍。 - 所以说,如果你需要文字小尾巴,根据这个来填写就可以了:
https://readme-typing-svg.demolab.com?font=Fira+Code&duration=0.1&color=<八位十六进制颜色代码>&repeat=false&multiline=true&width=435&height=<高度>&lines=<文字>
- 如果需要不止一行的话,把
<文字>
改为<第一行文字>;<第二行文字>
即可。
如果发现显示不全,可以把<高度>
从 50 往上增加。 -
我也很想用 SVG 的方式实现直接引用站内数据,可惜无论是小尾巴的设置还是帖子都无法直接插入代码式 SVG。