这款插件的名字叫做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/prettify.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="google-code-prettify/prettify.js"></script>

(3)在body加上onload=”prettyPrint()

<body onload="prettyPrint()">...</body>

(4)把代码放进<pre>...</pre> 或者 <code>...</code> 就能够实行代码高亮了。你也能够指定一种语言,class=”prettyprint
Lang-html”。在lang- 后加入下面不论什么一种语言。“bash”, “c”, “cc”, “cpp”, “cs”, “csh”, “cyc”, “cv”, “htm”, “html”, ”java”, “js”, “m”, “mxml”, “perl”, “pl”, “pm”, “py”, “rb”, “sh”, ”xhtml”, “xml”, “xsl”

(5)打开行号
你能够使用linenums打开行号

<pre class=”prettyprint linenums Lang-html”>

bootstrap设计站点中加入代码高亮插件的更多相关文章

  1. bootstrap设计网站中添加代码高亮插件

    这款插件的名字叫做google-code-prettify 使用该插件之前的效果: 使用插件之后的效果: 接下来说步骤: (1)下载两个文件 http://codecloud.sinaapp.com/ ...

  2. Word中使用代码高亮插件

    Word中使用代码高亮插件 1.下载并安装:SyntaxHighlighter4Word.zip 解压,然后双击bin\word2010\Kong.SyntaxHighlighter.Word2010 ...

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

    这款插件的名字叫做google-code-prettify 使用该插件之前的效果: 使用插件之后的效果: 接下来说步骤: (1)下载两个文件 http://codecloud.sinaapp.com/ ...

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

    本文由码农网 – 小峰原创,转载请看清文末的转载要求,欢迎参与我们的付费投稿计划! 对于喜欢写技术博客的同学来说,一定对代码高亮组件非常熟悉.一款优秀的JavaScript代码高亮插件,将会帮助你渲染 ...

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

    对于喜欢写技术博客的同学来说,一定对代码高亮组件非常熟悉.一款优秀的JavaScript代码高亮插件,将会帮助你渲染任何一种编程语言,包括一些关键字的着色,以及每行代码的缩进等.今天我们要来分享一些高 ...

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

    SyntaxHighlighter++这个插件的最大的优点就是可以在编辑器的下方有一个输入框,里面可以输入代码,然后插入到文章中.就不用编辑文章的时候,在可视化和文本之间来回切换了.非常适合不熟悉ht ...

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

    第一步:下载open live writer插件,下载地址:http://www.cnblogs.com/memento/p/5995173.html 第二步:找到open live writer的安 ...

  8. 一款代码高亮插件 -- SyntaxHighlighter

    SyntaxHighlighter 是当前用得最多的一款代码高亮插件,包括本博客也用到了该插件来显示代码,大家可以看到效果了.只不过这是针对WordPress的一款代码高亮插件,而今天我要给大家介绍的 ...

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

    子曰: 工欲善其事,必先利其器.作为码农一枚,再加上站长这个已经不再光鲜的称呼,岂能没有一款经济实用.操作简单.而且功能必须强大.样式也必须好看的Wordpress代码高亮插件?!作为一个视代码如生命 ...

随机推荐

  1. 将CAGradientLayer当做mask使用

    将CAGradientLayer当做mask使用 效果 源码 https://github.com/YouXianMing/Animations // // CAGradientView.h // M ...

  2. 几种常见的JavaScript混淆和反混淆工具分析实战

    几种常见的JavaScript混淆和反混淆工具分析实战 xiaix2016-03-05+8共1195751人围观 ,发现 5 个不明物体WEB安全 信息安全常被描述成一场军备竞赛,白帽与黑帽,渗透测试 ...

  3. 简明 MongoDB 入门教程

    MongoDB 是免费开源的跨平台 NoSQL 数据库,命名源于英文单词 humongous,意思是「巨大无比」,可见开发组对 MongoDB 的定位.与关系型数据库不同,MongoDB 的数据以类似 ...

  4. 在linux下 用p7zip 命令行下 解压 iso文件

    todo tomorrorw! 在linux下可以通过 mount IOSFILE.iso /media/myiso/ -o loop 这种方式挂载,然后直接从 目录中拷贝 iso的内容出来就可以. ...

  5. uva 400 Unix ls 文件输出排版 排序题

    这题的需要注意的地方就是计算行数与列数,以及输出的控制. 题目要求每一列都要有能够容纳最长文件名的空间,两列之间要留两个空格,每一行不能超过60. 简单计算下即可. 输出时我用循环输出空格来解决对齐的 ...

  6. Android -- Annotation

    Override Annotation @Override public void onCreate(Bundle savedInstanceState){}; 概念 An annotation is ...

  7. mono touch登录设计

    需要对MonoTouch.Dialog-1进行引用: using System; using System.Collections.Generic; using System.Linq; using ...

  8. Spark:java api实现word count统计

    方案一:使用reduceByKey 数据word.txt 张三 李四 王五 李四 王五 李四 王五 李四 王五 王五 李四 李四 李四 李四 李四 代码: import org.apache.spar ...

  9. 基于IE的多标签的浏览器-世界之窗2.4

    经常在Win32服务器上打开网页,但可能只是打开一个网页或是下载一点东西而已,虽然默认的IE浏览器基本上能满足需求 但还是存在不少的不便,比如如果要打开多个网页的话则需要再打开一个IE,还有就是习惯了 ...

  10. (转)HLSL,函数列表

    中文列表 函数名 说明 abs 计算输入值的绝对值. acos 返回输入值反余弦值. all 测试非0值. any 测试输入值中的任何非零值. asin 返回输入值的反正弦值. atan 返回输入值的 ...