zoukankan      html  css  js  c++  java
  • 博客园设置类似sublime高亮代码

    需要用到highlight.js,需要翻墙,官网为https://highlightjs.org,首先官网的只有默认主题包,我们需要自定义主题包需要去它的github上找,地址为https://github.com/isagalaev/highlight.js,我用的主题是monokai-sublime.css

    所以呢在github上把这个css文件给copy下来,然后把它的js文件也copy下来。上传文件到博客园,不要用官网的cdn,因为样式不能自定义,还要担心哪天地址不能用了

    <link rel="stylesheet" href="http://files.cnblogs.com/files/JAYIT/highlights.min.css">
    <script type="text/javascript" src="http://files.cnblogs.com/files/JAYIT/highlight9.3.min.js"></script>
    <script>hljs.initHighlightingOnLoad();</script>
    

     上面这段代码是我的引用 

     我们在要高亮代码的时候改成将<pre class="></pre> 改成<pre><code class=""></code></pre>注意这个html是指当前你要高亮的语言名如java,c#,c++等。如果呢你不想用的话,这玩意是允许你自定义的,首先在头部写一段声明js,记得要引用jquery

    $(document).ready(function() {
      $('pre code').each(function(i, block) {
        hljs.highlightBlock(block);
      });
    }); 
    

    那你想要用br来直接代替来声明代码高亮怎么办呢?加上下面这段js

    hljs.configure({useBR: true});
    
    $('div.code').each(function(i, block) {
      hljs.highlightBlock(block);
    });
    
    

    不使用它的类则设置nohighlight

    <pre><code class="nohighlight">...</code></pre>
    
    

      

      

  • 相关阅读:
    0045算法笔记——【随机化算法】舍伍德随机化思想搜索有序表
    精进~如何成为很厉害的人
    哪些小习惯一旦养成终生受用?
    2016第24周四
    2016第24周三
    2016第24周二
    2016第24周一
    2016第23周日
    前端资源汇总
    2016第23周五
  • 原文地址:https://www.cnblogs.com/JAYIT/p/5433309.html
Copyright © 2011-2022 走看看