文档章节

使用 highlight.js 高亮网站代码

aibati2008
 aibati2008
发布于 2016/12/06 15:56
字数 200
阅读 26
收藏 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
粉丝 12
博文 81
码字总数 60745
作品 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
django 模版渲染问题

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

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

没有更多内容

加载失败,请刷新页面

加载更多

下一页

ES6 Promise

Promise promise是异步编程的一种解决方案 1 什么是异步? 异步模式,每一个任务有一个或多个回调函数(callback),前一个任务结束后,不是执行后一个任务,而是执行回调函数,后一个任务则...

NDweb
18分钟前
0
0
Python百分登顶年度编程语言排行榜

今天 IEEE Spectrum 发布了 2018 年度顶级编程语言排行榜。该榜单可根据流行趋势、职业方向、语言类型等多个标准各自细分生成榜单,也可以综合多个标准进行排列,使用者可以根据自己的需求过...

六库科技
22分钟前
0
0
consul笔记

安装和启动就不说了,很简单。 注册一个服务: http://localhost:8500/v1/agent/service/register put请求,json格式内容如下 { "ID": "userServiceId", //服务id "Name": "userService", //服...

朝如青丝暮成雪
23分钟前
0
0
iOS CollectionView 的那些事

UICollectionView是开发中用的比较多的一个控件,本文记录UICollectionView在开发中常用的方法总结,包括使用UICollectionViewFlowLayout实现Grid布局、添加Header/Footer、自定义layout布局...

aron1992
23分钟前
0
0
linux tar.gz zip 解压缩 压缩命令

http://apps.hi.baidu.com/share/detail/37384818 download ADT link http://dl.google.com/android/ADT-0.9.6.zip download SDK link http://dl.google.com/Android/android-sdk_r11-linux_......

owensliu
25分钟前
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部