首页 > Web开发 > 详细

让你的代码亮起来 highlight.js

时间:2019-11-04 21:11:39      阅读:84      评论:0      收藏:0      [点我收藏+]

highlight.js是一让你的代码在html页面中高亮起的的一个插件,官方提供了十几款高亮的样式,说明文档也易懂,很是不错。

引用 highlight.js 并初始化

highlight.js支持34种常用语言,国内cdn建议地址如下:

<link href="https://cdn.bootcss.com/highlight.js/9.15.10/styles/default.min.css" rel="stylesheet">
<script src="https://cdn.bootcss.com/highlight.js/9.15.10/highlight.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>

可以选择一个喜欢的样式
技术分享图片

给 highlight.js 增加行号

增加行号需要引用一个插件:highlightjs-line-numbers.js

<script src="https://cdnjs.cloudflare.com/ajax/libs/highlightjs-line-numbers.js/2.5.0/highlightjs-line-numbers.min.js"></script>
//初始化插件
<script>
hljs.initHighlightingOnLoad();
hljs.initLineNumbersOnLoad();
</script>

看看最终效果吧
技术分享图片

让你的代码亮起来 highlight.js

原文:https://www.cnblogs.com/ihappycat/p/11794469.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!