今天逛知乎发现他们的链接卡片挺好看,就想写一个自己拿来博客用(扒下来知乎的代码),效果如下。
源码放在github,感兴趣的朋友可以自己拿。
兰州小红鸡的博客 小鸡背单词 github | 模仿知乎的卡片链接
如何使用
在需要把链接转换成卡片的地方,将<a>标签的class设置为LinkCard。
然后再后面引入js文件就好了
例如
<a target="_blank" href="https://github.com/flymysql" class="LinkCard">flymysql</a>
<script type="text/javascript" src="https://picture-1256429518.cos.ap-chengdu.myqcloud.com/linkcard.js"></script>
¶实现代码
就是直接地修改<a>标签地dom内容,好像没什么好说的,样式我是直接从知乎扒下来的。
暂无评论,来抢沙发吧。