文档章节

使用 highlight.js 高亮网站代码

aibati2008
 aibati2008
发布于 2016/12/06 15:56
字数 200
阅读 30
收藏 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
博文 82
码字总数 60908
作品 0
成都
技术主管
6个 JavaScript 语法高亮插件

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

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

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

X_Jun
07/18
0
0
9款有用的Javascript代码高亮脚本

原文:9款有用的Javascript代码高亮脚本 译自: webdesignbooth 转自:http://www.qianduan.net/9-useful-javascript-syntax-highlighting-scripts.html 代码高亮 很重要,特别是当我们想要在...

晨曦之光
2012/03/09
0
0
8 个 jQuery 的语法高亮插件

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

oschina
2012/11/17
8.4K
4
Vue集成highlight.js

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

asing1elife
09/22
0
0

没有更多内容

加载失败,请刷新页面

加载更多

centos7安装rsync及两台机器进行文件同步

centos7安装rsync及两台机器进行文件同步 2017年12月21日 11:17:46 码农下的天桥 阅读数:2210 标签: centosrsync同步 更多 个人分类: 后端 所属专栏: 研发模式及运维 版权声明:本文为博...

linjin200
42分钟前
2
0
jpg、jpeg、png... 的区别

jpg、jpeg、png... 的区别 对于做设计这一行的人来说,这几个图片格式是最常用的,也是最常见的,几乎每一天都要与他们打交道。 刚刚入门的新人通常不知道在什么地方如何使用他们或者说如何更...

DemonsI
今天
5
0
白话SpringCloud | 第十章:路由网关(Zuul)进阶:过滤器、异常处理

前言 简单介绍了关于Zuul的一些简单使用以及一些路由规则的简单说明。而对于一个统一网关而言,需要处理各种各类的请求,对不同的url进行拦截,或者对调用服务的异常进行二次处理等等。今天,...

oKong
今天
3
0
Character的static方法

基本类型char的包装类是Character,使用的比较多,大家是比较熟悉的。 我只是觉得里面有很多static方法,平时不怎么用,学习一下怎么实现的,或许日后就用到了。 static int compare(char x,...

woshixin
今天
2
0
正则介绍_sed

10月17日任务 9.4/9.5 sed sed工具 匹配打印 -n 只打印匹配行,不然其他行也会打印出来 p 打印(配合-n使用) [root@centos7 tmp]# sed -n '/root/'p passwd root:x:0:0:root:/root:/bin/ba...

robertt15
今天
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部