zoukankan      html  css  js  c++  java
  • 解决Bootstrap中代码不高亮问题

    背景:本人用node.jsbootstrap搭建的博客,可惜用marked解析markdown语法后,代码显示灰底黑字,样子很丑。
    所以找到了这个方法,可以让代码高亮,虽然也不漂亮,但比原始状态稍好些。

    先来看看对比图:
    ============>

    解决方案

    找了好多的解决方案,无意中在github上发现了google/code-prettify这个项目,本次修改就是在这个基础之上。github项目链接

    开始干活

    第一步

    我们从github上的说明可以看到,在使用之前需要引入一个js文件,我们可以把这个文件download下来放到我们服务器里。

    执行如下命令

    $ curl https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js > prettify.js
    

    之后你会发现在当前目录下有个prettify.js文件。把这个文件移动到你服务器相应的javascript目录下。然后在前端页面引用之。

    第二步

    github上的文档使用说明,我们可以看到,需要给<pre>标签加上class="prettyprint"才能使代码高亮。但是我们知道bootsctrap本身的pre标签是没有这个class的,所以我们可以在marked.js解析markdown文件的时候做些修改。

    • 首先确保你的marked模块安装成功,可以参考这篇粉丝日志

    打开marked模块目录,修改相应的文件

    $ cd node_modules/lib
    $ vim marked.js
    

    找到如图所以位置(可以查找pre关键字)

    修改成如下所示

    第三步

    重启服务,试试你的markdown 代码块效果吧。

    新博客地址:http://www.crabx.site 各种功能还未完善,请手下留情。

  • 相关阅读:
    Django登录逻辑,中间用到Cookie创建、读取、删除、等操作
    CBV和FBV用户认证装饰器
    Django Session配置
    Django基于Cookie装饰器实现用户认证
    回归博客
    Jenkins部署
    iostat命令详解
    被入侵和删除木马程序的经历
    centos7 centos-home 磁盘转移至centos-root下
    zabbix图形显示口口不显示汉字
  • 原文地址:https://www.cnblogs.com/ubuntu-kevin/p/5056512.html
Copyright © 2011-2022 走看看