推荐Prism.js高亮代码语法插件

prismjs 是一款轻量、可扩展的代码语法高亮库,使用现代化的 Web 标准构建,使用 Prismjs 可以快速为网站添加代码高亮功能,支持超过多种编程语言,还支持多种插件,是简洁、高效的代码高亮解决方案。杨琼博客就是使用了Prism.js 实现漂亮的代码语法高亮功能,对比SyntaxHighlighter相比加载更快,请求也少。

prismjs

极致易用
引用 prism.css 和 prism.js,使用合适的 HTML5 标签(code.language-xxxx),搞定!
天生伶俐
语言的 CSS 类是可继承的,所以你只需定义一次就能应用到多个代码片段。
轻如鸿毛
代码压缩后只有 1.6KB。每添加一个语言平均增加 0.3-0.5KB,主题在 1KB 左右。
快如闪电
如果可能,支持通过 Web Workers 实现并行。
轻松扩展
定义新语言或扩展现有语法,或者新增功能都非常简单。
丰富样式
所有的样式通过 CSS 完成,并使用合理的类名如:.comment, .string, .property 等。

插件显示行号,自定义类,加载颜色等
栗子(鼠标移动到时间/运动上试试):


div {
	transition: all linear 3s;
}
div {
	transition: color 0.3s ease-in-out;
}

使用方法简单,官网叙述很清楚这里就不阐述

Prism.js官网地址:

http://prismjs.com/

1.本文由杨琼博客整理发布,部分文章来自网络,如有侵犯权益,请联络博主,资源失效和内容勘误欢迎留言.

2.转载请注明本文地址:http://www.iyangqiong.com/web/373.html

3.订阅更新:您可以通过 RSS订阅本站

【推荐!必备网址导航】http://longmiao.wang/

分享到:
顶部 评论 底部