文档章节

使用 highlight.js 高亮网站代码

aibati2008
 aibati2008
发布于 2016/12/06 15:56
字数 200
阅读 25
收藏 1
点赞 0
评论 0

首先让我们看一下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
粉丝 12
博文 79
码字总数 60745
作品 0
成都
技术主管
6个 JavaScript 语法高亮插件

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

晨曦之光 ⋅ 2012/03/20 ⋅ 8

9款有用的Javascript代码高亮脚本

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

晨曦之光 ⋅ 2012/03/09 ⋅ 0

8 个 jQuery 的语法高亮插件

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

oschina ⋅ 2012/11/17 ⋅ 4

django 模版渲染问题

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

扁豆焖面先生 ⋅ 2015/01/13 ⋅ 3

15 款代码语法高亮工具,美化你的代码

语法高亮是文本编辑器用来显示文本的,特别是源代码,根据不同的类别来用不同的颜色和字体显示。这个功能有助于编写结构化的语言,比如编程语言,标记语言,这些语言的语法错误显示是有区别的...

oschina ⋅ 2014/03/13 ⋅ 11

语法高亮--Highlight.js

highlight.js是一个用于在任何web页面上着色显示各种示例源代码语法的JS项目。具有以下特色: 支持 92 种语言,49 种代码格式化风格。 自动检测语言种类 支持多语言混合的代码高亮 支持Node....

匿名 ⋅ 2008/09/24 ⋅ 3

Highlight.js 9.4.0 发布,JavaScript 语法高亮库

Highlight.js 9.4.0 发布了,该版本主要改进内容包括: 新语言支持: PureBASIC by Tristano Ajmone BNF by Oleg Efimov Ada by Lars Schulna 新样式: PureBASIC by Tristano Ajmone 改进: ......

oschina ⋅ 2016/05/19 ⋅ 6

给大家推荐一款高大上的代码高亮插件(sublime,github风格)——highlight.js

经常在一些大神博客里面看到非常好看的高亮代码,有sublime风格,GitHub风格等等。毫无疑问,好的高亮代码插件可以不仅仅让你的博文显得更高大上,更重要的是舒适的阅读体验。经过我在网上的...

wewoor ⋅ 2014/04/15 ⋅ 0

开源知识库--Raneto

Raneto 是开源知识库平台,使用静态 Markdown 文件。Raneto 非常简单应用,而且也非常平滑,速度也非常快,其他特性: Mustache 响应式默认模板 (powered by Bootstrap) Highlight.js 代码语...

叶秀兰 ⋅ 2014/12/12 ⋅ 0

Java 博客系统--ZBlog

ZBlog 是一套采用Java语言写的博客系统,主要包括的功能有: 博客文章的发布,增删改查管理; 留言板功能; 导航的动态扩展,页面的基本编辑; 4. 文章归档,分类等等功能。 博客服务器端采用的...

wewoor ⋅ 2014/04/26 ⋅ 2

没有更多内容

加载失败,请刷新页面

加载更多

下一页

从 Confluence 5.3 及其早期版本中恢复空间

如果你需要从 Confluence 5.3 及其早期版本中的导出文件恢复到晚于 Confluence 5.3 的 Confluence 中的话。你可以使用临时的 Confluence 空间安装,然后将这个 Confluence 安装实例升级到你现...

honeymose ⋅ 今天 ⋅ 0

Java8新增的DateTimeFormatter与SimpleDateFormat的区别

两者最大的区别是,Java8的DateTimeFormatter也是线程安全的,而SimpleDateFormat并不是线程安全。 在并发环境下使用SimpleDateFormat 为了能够在多线程环境下使用SimpleDateFormat,有这三种...

人觉非常君 ⋅ 今天 ⋅ 0

多线程如何控制执行顺序

线程的生命周期说明: 当线程被创建并启动以后,它既不是一启动就进入了执行状态,也不是一直处于执行状态,在线程的生命周期中,它要经过新建(New)、就绪(Runnable)、运行(Running)、...

MarinJ_Shao ⋅ 今天 ⋅ 0

用ZBLOG2.3博客写读书笔记网站能创造今日头条的辉煌吗?

最近两年,著名的自媒体网站今日头条可以说是火得一塌糊涂,虽然从目前来看也遇到了一点瓶颈,毕竟发展到了一定的规模,继续增长就更加难了,但如今的今日头条规模和流量已经非常大了。 我们...

原创小博客 ⋅ 今天 ⋅ 0

MyBatis四大核心概念

本文讲解 MyBatis 四大核心概念(SqlSessionFactoryBuilder、SqlSessionFactory、SqlSession、Mapper)。 MyBatis 作为互联网数据库映射工具界的“上古神器”,训有四大“神兽”,谓之:Sql...

waylau ⋅ 今天 ⋅ 0

以太坊java开发包web3j简介

web3j(org.web3j)是Java版本的以太坊JSON RPC接口协议封装实现,如果需要将你的Java应用或安卓应用接入以太坊,或者希望用java开发一个钱包应用,那么用web3j就对了。 web3j的功能相当完整...

汇智网教程 ⋅ 今天 ⋅ 0

2个线程交替打印100以内的数字

重点提示: 线程的本质上只是一个壳子,真正的逻辑其实在“竞态条件”中。 举个例子,比如本题中的打印,那么在竞态条件中,我只需要一个方法即可; 假如我的需求是2个线程,一个+1,一个-1,...

Germmy ⋅ 今天 ⋅ 0

Django第一期

安装Django 去https://www.djangoproject.com/download/ 下载最新版的Django,然后解压放到Anaconda\Lib\site-packages目录下,然后cmd进入此目录,输入安装命令: python setup.py install ...

大不了敲一辈子代码 ⋅ 今天 ⋅ 0

Springboot2 之 Spring Data Redis 实现消息队列——发布/订阅模式

一般来说,消息队列有两种场景,一种是发布者订阅者模式,一种是生产者消费者模式,这里利用redis消息“发布/订阅”来简单实现订阅者模式。 实现之前先过过 redis 发布订阅的一些基础概念和操...

Simonton ⋅ 今天 ⋅ 0

error:Could not find gradle

一.更新Android Studio后打开Project,报如下错误: Error: Could not find com.android.tools.build:gradle:2.2.1. Searched in the following locations: file:/D:/software/android/andro......

Yao--靠自己 ⋅ 昨天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部