在博客园平台为代码添加行号显示

效果预览

在前面两篇文章中,我们分别为大家介绍了如何在博客园平台的文章添加目录,以及为文章代码添加高亮,在这篇文章中我们介绍下为文章中的代码添加行号显示,具体效果如下所示(效果图的源文章请参考这篇博客):

插入页脚代码

在设置-页脚HTML代码中插入如下代码:

<link href="https://cdn.bootcss.com/highlight.js/9.6.0/styles/atelier-lakeside-dark.min.css" rel="stylesheet"/>
<script src="//cdn.bootcss.com/highlight.js/9.11.0/highlight.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>
<script src="//cdn.bootcss.com/highlightjs-line-numbers.js/1.1.0/highlightjs-line-numbers.min.js"></script>
<script>hljs.initLineNumbersOnLoad();</script>

版权声明

本文首发链接为:https://www.cnblogs.com/dechinphy/p/line-number.html

作者ID:DechinPhy

更多原著文章请参考:https://www.cnblogs.com/dechinphy/

参考链接

  1. https://www.cnblogs.com/sxgsxg/p/13529556.html
posted @ 2021-03-01 14:29  陆言君  阅读(25)  评论(0编辑  收藏