CodePrettify代码高亮插件

2026-08-06

7个高性能JavaScript代码高亮插件

本文由码农网 – 小峰原创,转载请看清文末的转载要求,欢迎参与我们的付费投稿计划! 对于喜欢写技术博客的同学来说,一定对代码高亮组件非常熟悉.一款优秀的JavaScript代码高亮插件,将会帮助你渲染任何一种编程语言,包括一些关键字的着色,以及每行代码的缩进等.今天我们要来分享一些高性能的JavaScript代码高亮插件,这些JavaScript代码高亮插件将非常有效地帮你实现在网页上的代码编辑和展示. 1.SyntaxHighlighter – 最优秀的JavaScript代码高亮插件 Syn

google code-prettify 代码高亮插件使用方法

找代码高亮插件选了好久,还是这个使用起来比较方便. 先上链接:插件下载地址官方使用方法地址建议看官方的资料,我这里仅仅简要描述一下使用方法: 引入方法: 测试引入是否成功:herf 换成自己放置的路径,打开测试网页源代码,点击css,js文件链接能看到代码内容即OK. <link rel="stylesheet" type="text/css" href="prettify.css"> <script type=&quo

轻量级jQuery语法高亮代码高亮插件jQuery Litelighter。

<!DOCTYPE html><html><head><meta charset="UTF-8" /><title>jQuery Litelighter</title> <style> body{background: #FAF9F4;}#wrapper h1{ color: #000; letter-spacing: 2px; font-size: 30px;}#wrapper h2{ color:

[转]7个高性能JavaScript代码高亮插件

对于喜欢写技术博客的同学来说,一定对代码高亮组件非常熟悉.一款优秀的JavaScript代码高亮插件,将会帮助你渲染任何一种编程语言,包括一些关键字的着色,以及每行代码的缩进等.今天我们要来分享一些高性能的JavaScript代码高亮插件,这些JavaScript代码高亮插件将非常有效地帮你实现在网页上的代码编辑和展示. 1.SyntaxHighlighter – 最优秀的JavaScript代码高亮插件 SyntaxHighlighter 是一款完全基于JavaScript的代码高亮插件,Sy

代码高亮插件Codemirror使用方法及下载

代码高亮插件Codemirror使用方法及下载 - 老男孩的日志 - 网易博客代码高亮插件Codemirror使用方法及下载 2013-10-31 16:51:29| 分类: 默认分类 | 标签: |举报 |字号大中小订阅 codemirror是一个强大的javascript开发的语法高亮显示引擎, 它支持众多的变成语言,例如, PHP,JS,HTML,CSS.这里我们简单的介绍如何使用Codemirror来配置你的网站支持代码语法高亮显示. 安装首先,下载codemirr

Word中使用代码高亮插件

Word中使用代码高亮插件 1.下载并安装:SyntaxHighlighter4Word.zip 解压,然后双击bin\word2010\Kong.SyntaxHighlighter.Word2010.vsto或bin\word2007\Kong.SyntaxHighlighter.Word2007.vsto,即可完成安装,当然前提是你装了.net framework 4.0. 2.在cnblogs个人设置主页设置代码颜色相间的风格. 页面定制CSS代码: #cnblogs_post_bod

代码高亮插件推荐——SyntaxHighlighter++

SyntaxHighlighter++这个插件的最大的优点就是可以在编辑器的下方有一个输入框,里面可以输入代码,然后插入到文章中.就不用编辑文章的时候,在可视化和文本之间来回切换了.非常适合不熟悉html的博主. 支持的语言有AppleScript.AS3.Bash.C.C++.C#.ColdFusion.CSS.Delphi.Diff.Erlang.Groovy.HTML.Java.JavaFX.JavaScript.Perl.PHP.Plain.PowerShell.Python.Ruby.

MarkdownPad2代码高亮插件兼容移动端样式

如果不知道MarkdownPad2使用代码高亮插件可以查看前一篇文章<MarkdownPad2使用代码高亮插件> 先看移动端效果图: 移动端点击查看效果或者手机扫如下二维码: 我们经常阅读微信公众号文章的时候,常常看到文章内有高亮的代码,并且这代码不会换行,可以左右拖动滚动这样的效果对于我们阅读代码很方便也很舒服,上一篇文章使用高亮插件并不兼容移动端,经过简单的对高亮代码样式得修改,再通过markdownpad2导出html,这样我们就可以在移动端查看自己的代码笔记了.这个时候有人会纳闷我在

OLW （Open Live Writer）安装代码高亮插件方法（简明）

1.首先下载OLW代码高亮插件,请点击--->OLW代码高亮插件 2.在你安装OLW的目录下(顺便说一下默认的安装目录为C:\Users\你的用户名\AppData\Local\OpenLiveWriter)找到 app-0.6.2 的文件夹,进去,然后该目录下创建plugins文件夹. 3.将刚复制的两个文件粘贴在该文件夹里面. 最后重新启动OLW,在insert(插入)选项里面的 plug-ins里面可以看到CNBlogs插入代码,写博客时可以使用它高亮编程代码.

open live write 代码高亮插件的配置和使用

第一步:下载open live writer插件,下载地址:http://www.cnblogs.com/memento/p/5995173.html 第二步:找到open live writer的安装目录,并在目录下创建文件夹Plugins 第三步:解压缩插件的压缩包Memento.OLW_V1.0.0.5.7z,并把文件都拷贝到Plugins文件夹中第四步:右键选择每一个文件的属性,看是否有解除锁定,如果有,选择解除,斌确认注:我的系统是win7,有解除锁定,必须解除后,插件才能使用,请

一款代码高亮插件 -- SyntaxHighlighter

SyntaxHighlighter 是当前用得最多的一款代码高亮插件,包括本博客也用到了该插件来显示代码,大家可以看到效果了.只不过这是针对WordPress的一款代码高亮插件,而今天我要给大家介绍的是针对所有类型网站都可以用的juqery插件不容错过额. 使用步骤 1.默认代码格式 <pre class="brush:js;toolbar:false">var myMood ="happy"; //单词“happy”是JavaScript语言中的一个字

WordPress代码高亮插件SyntaxHighlighter终极使用详解

子曰: 工欲善其事,必先利其器.作为码农一枚,再加上站长这个已经不再光鲜的称呼,岂能没有一款经济实用.操作简单.而且功能必须强大.样式也必须好看的Wordpress代码高亮插件?!作为一个视代码如生命的码农,把代码整的漂漂亮亮是一件多么神圣和伟大的事情啊! 今天就给大家推荐一款这样的代码高亮插件:SyntaxHighlighter Evolved.相信我, 功这款插件能强足够大.并且简单易用,绝对值得推荐.本站就是用的这款插件,大家可以看看“生病的JavaScript代码”,这就是最好的例子.插

OneNote2016代码高亮插件的安装与使用

OneNote2016代码高亮插件的安装与使用使用效果我觉得CSDN和博客园上面的许多讲解都不是很清晰,最后还是我自己弄好的.这里分享一下: 第一步要确认自己OneNote的版本是32位的还是64位的. 文件——>账户——>关于onenote 在上面就可以看到了第二步进入下载源 https://github.com/elvirbrk/NoteHighlight2016/releases 64位的下载并安装NoteHighlight2016.msi 32位的下载并安装NoteHighlig

20140316 window live write 插件推荐代码高亮插件构造函数只能用初始化成员列表方式的例子

1.window live write 插件:http://www.cnblogs.com/liuxianan/archive/2013/04/13/3018732.html 2.推荐代码高亮插件:WindowsLiveWriter.CNBlogs.CodeHighlighter 3.构造函数只能用初始化成员列表方式的例子 #include<iostream> class CMember { public: CMember(int x) {} }; class CMyClass { publi

给大家推荐一款高大上的代码高亮插件（sublime，github风格）——highlight.js

经常在一些大神博客里面看到非常好看的高亮代码,有sublime风格,GitHub风格等等.毫无疑问,好的高亮代码插件可以不仅仅让你的博文显得更高大上,更重要的是舒适的阅读体验.经过我在网上的一番搜罗,终于找到了一款非常赞的高亮插件,先来看看效果吧! 1.Javascript 效果 //检测URL function checkeUrl(url){ return new RegExp("^(https|http|ftp|rtsp|mms)://[-a-zA-Z0-9+&@#/%?=~_|!:

Windows Live Writer代码高亮插件对比

一.Paste ASVisual Studio Code 参考:http://www.cnblogs.com/mikelij/archive/2010/11/13/1876199.html 插件下载:http://pan.baidu.com/s/1i3iUO53 个人备注:可能存在VS SQL版本兼容问题(中文乱码),网上有解决方案代码效果,中文乱码请无视 /// <summary> /// ?????? /// </summary>

使用Open Live Writer 的代码高亮插件体验

由于windows live writer 2012 已经停止服务,转而推出开源项目Open Live Writer .虽然Open Live Writer 也没怎么更新,官网更是一个插件都没有放出来.但是本着尝鲜的想法,还是下载了Open Live Writer ,不过问题来了,代码高亮问题怎么解决? 这个插件在博客园的公告中是有提示的.不过我在博客园上面还是发现了另一个功能比较强的插件(准确的说,都在博客园的公告中有提到) 插件的下载页http://www.cnblogs.com/memen

highlight.js 代码高亮插件的使用

在网页使用过程中,经常会用到代码的展示.而不同颜色的代码,可以让代码看起来更直观,也更美观. 找了几个不同的插件,觉得highlight的插件比较实用,而且用起来炒鸡简单. 比如这样: 首先,我们先下载一个highlight的js文件. https://highlightjs.org/ 点击get version按钮进入语言选择勾选你常用的语言,在使用插件时会自动检测你要展示的代码的语言,并自动让代码高亮.通常common就足够用了. 然后点击下面的download按钮,下载,解压. 在解压后

【highlight.js】页面代码高亮插件

[highlight.js] 很多博客都支持页面插入各种语言的代码,而这些代码肯定是有高亮设置的.那么在我们自己的页面上如何进行代码高亮设置?有现成的这个highlight.js插件我们可以使用. highlight.js的官网是[https://highlightjs.org/]可以去上面下载插件.如果习惯用cdn可以百度一下怎么用cdn的方法来引用相关文件,我这里就把这个包下载到本地来了. ■ 简单用法简单的用法我们主要用到了highlight/highligh.pack.js这个js文件

bootstrap设计站点中加入代码高亮插件

这款插件的名字叫做google-code-prettify 使用该插件之前的效果: 使用插件之后的效果: 接下来说步骤: (1)下载两个文件 http://codecloud.sinaapp.com/google-code-prettify/prettify.css http://codecloud.sinaapp.com/google-code-prettify/prettify.js (2)在head中引入这两个文件 <link href="google-code-prettify/p

CodePrettify代码高亮插件

热门专题