html语⾔⾼亮代码，实现HTML⽹页代码⾼亮的⼏种选择
代码⾼亮可以说是程序员必备，⽆论是搭建模块，或者是产品的说明⽹站都是需要展⽰代码的，⽽代码的样式直接的影响了阅读效果，⼀个好的代码⾼亮插件将会有好的体验。
Jekyll
Jekyll 是⼀种通过模版和数据编译为HTML的⼯具，说是⼯具，但是也可以说是服务，如果借助Github(搭建有Jekyll服务，可以实时编译)可以做出半动态⽹页；对于没有⾃⼰服务器的朋友来说是不错的选择。
⼀般情况下，使⽤Github＋Jekyll来搭建博客和⼀些说明性质的⽹页。
Mac下就⽤命令⾏搞定了。
在官⽅⽂档中可以看见其代码是⾮常简单的：
{% highlight ruby %}
def show
@widget = Widget(params[:id])
respond_to do |format|
format.html # b
format.json { render json: @widget }
end
end
{% endhighlight %}
得到的效果也就是：oracle下载不了
这个算是很多Jekyll 教程中使⽤的了，在⼤部分的⾼亮博客中基本都是使⽤的该⾼亮器。编译的时候需要先安装Python。
安装后我们执⾏命令：
gem install pygments.rb
安装好了后，我们需要修改Jekyll项⽬的**_l** ⽂件，修改其中的 highlighter 为：
markdown: kramdown
highlighter: pygments
然后重启Jekyll服务。
Codemathematica
{% highlight ruby %} def show @widget = Widget(params[:id]) respond_to do |format| format.html # b
format.json { render json: @widget } end end {% endhighlight %}
很多⼈都不知道这个css⽂件从哪来；⼤部分都是拷贝拷贝再拷贝，⽽且都是6～7年前的了。
其实有多种办法得到：
第⼆种
直接下载，打开⽹页：/demo/3666780/ 右边可以选择样式，选择GO就可以看见效果，⽽此时打开浏览器调试，可以看见其中有⼀个 pygments.css ⽂件，下载即可。
Show
Rouge
这个个⼈⽐较喜欢，上⾊⽐较纯净，看着舒服。⽐Pygments⽀持语⾔少⼀些，如果是使⽤的 Pygment
s ，哪么基本不⽤更改任何源码，只需要更改css引⽤就OK。当然rouge也是Jekyll默认的⾼亮编译。
⾸先修改Jekyll项⽬的**_l** ⽂件，修改其中的 highlighter 为：
markdown: kramdown
highlighter: rouge如何调出电脑菜单栏
然后重启Jekyll服务。
Code
{% highlight ruby %} def show @widget = Widget(params[:id]) respond_to do |format| format.html # b
format.json { render json: @widget } end end {% endhighlight %}
默认的 rouge 主题偏向于⽩⾊，所以我设置了背景为⿊⾊。
这⾥也是需要 rouge.css ⽂件，此时我们使⽤命令⾏来得到：
html个人网页制作代码范列rougify style monokai.sublime > rouge.css
这样就能⽣成⼀个默认的css⽂件，当然更多的主题⽣成详见开源项⽬说明。
Show
Highlight JS
大样本随机分组方法总的来说，Highlight算是⽐较⼴泛，使⽤⽤户量也挺⾼的了。效果不错，⽀持语⾔多。
Highlight 可以完美兼容 Rouge 与 Pygments ，所以不需要修改任何配置，只需要更改⼀下css与js引⽤就OK。
ospf协议是基于什么算法Code
{% highlight ruby %} def show @widget = Widget(params[:id]) respond_to do |format| format.html # s
b
format.json { render json: @widget } end end {% endhighlight %}
当然你也可以直接使⽤HTML在MD⽂档中：
...
Show
样式有多种，可以任意选择。
SyntaxHighlighter
这算是⽐较⽼的⼀种代码⾼亮插件了，去年迁移了⼀次，现在在Github上维护，质量挺好的，V4版本不错。
⾸先下载, 然后⾃⼰使⽤命令编译：
编译后可以得到 js 与 css ⽂件；当然使⽤命令不同样式可以有⼏种可以选择。
Code
def show
@widget = Widget(params[:id])
respond_to do |format|
format.html # b
format.json { render json: @widget }
end
end
Show在这⾥并没有使⽤ Jekyll 进⾏code编译，⽽是保留原样式，在页⾯上使⽤ js 进⾏解析。
Prismjs
prismjs 算是⽐较优良的作品了，⽣成代码不多余，颜⾊适⽤于⼤部分⽹站；主题有⼏种；⽀持的语⾔挺多；不过细节部分没有完善有些情况下样式显⽰不是很好，像XML代码不⽀持 的样式；⽬前⾕歌的使⽤挺多。
Jekyll 并不能直接⽀持他，需要下载 prism.rb 插件来使⽤。下载后拷贝到项⽬“_plugins“ ⽂件夹中。
prismjs 中并不能直接使⽤ {% highlight %} 命令，⽽需要使⽤ {% prism %} 命令。
Code
{% prism ruby %} def show @widget = Widget(params[:id]) respond_to do |format| format.html # b format.json { render json: @widget } end end {% endprism %}
Show
总结
⽬前这⼏种算是⽐较优秀的代码⾼亮了；各位看官就按照⾃⼰喜好使⽤就好。
全部的代码和⽂件都提交到了GITHUB上了，⽂件地址:

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。