文档章节

使用 highlight.js 高亮网站代码

aibati2008
 aibati2008
发布于 2016/12/06 15:56
字数 200
阅读 32
收藏 1

首先让我们看一下highlight.js 的官方文档示例https://highlightjs.org,里边高亮的样式和语言有很多种,可以根据自己的偏好给代码上色。

具体用法:官方文档highlight用法

用法非常简单:

一、引入 highlight.js 文件

我们需要在页面中同时引入一个 js 文件和一个 css 文件,这里直接使用百度静态资源库提供的 CDN 链接提升加载速度,当然也可以引入本地的。

    <link href="http://apps.bdimg.com/libs/highlight.js/9.1.0/styles/default.min.css" rel="stylesheet">
    <script src="http://apps.bdimg.com/libs/highlight.js/9.1.0/highlight.min.js"></script>
    <script>hljs.initHighlightingOnLoad();</script>

二、自定义初始化

如果对高亮还有其他需求,这是可以进行初始化代设置

$(document).ready(function() {
  $('pre code').each(function(i, block) {
    hljs.highlightBlock(block);
  });
});

© 著作权归作者所有

共有 人打赏支持
aibati2008
粉丝 13
博文 84
码字总数 61386
作品 0
成都
技术主管
私信 提问
6个 JavaScript 语法高亮插件

语法高亮对所有的代码编辑器来说是一个很重要的特性。当然它应该增加可读性,简化调试过程,给不同的代码语法设置不同的颜色。如果你的网站可以分享代码或者教程,你应该确保有一个好的语法高...

晨曦之光
2012/03/20
6.1K
8
博客园使用highlight.js对代码进行高亮,并实现自定义关键词高亮

看了网上那么多有关highlight.js的教程,自己还没学过JavaScript和CSS,硬是花了3天的时间,才终于弄出了自己想要的效果。一开始我的博客园代码高亮效果是这样的: 个人希望代码块能够实现下...

X_Jun
07/18
0
0
Vue集成highlight.js

版权声明:本文首发 http://asing1elife.com ,转载请注明出处。 https://blog.csdn.net/asing1elife/article/details/82796652 Vue集成highlight.js highlight.js是一个比较实用的语法高亮插...

asing1elife
09/22
0
0
django 模版渲染问题

django 模版渲染的时候,把{{ article.content }}中范例的 " img标签" 也给渲染了,求教有什么办法避免? ps :高亮代码时, 我使用了highlight.js...

扁豆焖面先生
2015/01/13
354
3
8 个 jQuery 的语法高亮插件

这里介绍 8 款 jQuery 插件,用于实现在网页上对代码进行语法高亮。 1. Highlight.js Highlight.js是一个用于在任何web页面上着色显示各种示例源代码语法的JS项目。 2. Google Code Prettif...

oschina
2012/11/17
9.2K
4

没有更多内容

加载失败,请刷新页面

加载更多

如何在10分钟内设置EOS钱包和帐户?

由于SuperNode超级节点社区建立在EOS之上,我们希望引导我们的社区成员设置EOS钱包和帐户,以便充分参与我们的生态系统。 虽然设置过程可能不如其他区块链系统那么简单,但不要担心。本指南旨...

笔阁
14分钟前
1
0
8.04-Win10非U盘重装系统

注意:最好准备一个你所需版本的秘钥(不能是数字0开头的) 【所需:Win10的ISO镜像、能够解压ISO格式的解压缩工具、最好准备你所需版本的秘钥(不能是数字0开头的)】 1、创建新的文件系统为...

静以修身2025
15分钟前
0
0
Docker的架构与自制镜像的发布

一. docker 是什么 大家都知道虚拟机吧,windows 上装个 linux 虚拟机是大部分程序员的常用方案。公司生产环境大多也是虚拟机,虚拟机将物理硬件资源虚拟化,按需分配和使用,虚拟机使用起来...

程序猿拿Q
31分钟前
8
0
ubuntu下pycharm调用Hanlp实践分享

前几天看了大快的举办的大数据论坛峰会的现场直播,惊喜的是hanlp2.0版本发布。Hanlp2.0版本将会支持任意多的语种,感觉还是挺好的!不过更多关于hanlp2.0的信息,可能还需要过一段时间才能看...

左手的倒影
40分钟前
2
0
Python监控服务器实现邮件微信报警[未测试]

本文中笔者暂时实现的只有cpu和内存的监控,python可以监控许多的主机信息,网络,硬盘,机器状态等,以下是代码的实现,代码可以实现windows和linux的监控。 实验环境:Ubuntu16.04和windo...

dragon_tech
45分钟前
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部