这款插件的名字叫做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. 如何在Open Live Writer(OLW)中使用precode代码高亮Syntax Highlighter

    早先Microsotf的Windows Live Writer(WLW)现在已经开源了,并且更名为Open Live Writer,但是现在Windows Live Writer还是可以现在,Open ...

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

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

  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. 【hdoj_1133】Buy the Ticket(卡特兰数+大数)

    题目:http://acm.hdu.edu.cn/showproblem.php?pid=1133 题目的意思是,m个人只有50元钱,n个人只有100元整钱,票价50元/人.现在售票厅没钱,只有50元 ...

  2. Java学习(匿名对象、内部类、包、import、代码块)

    一.匿名对象 概念:匿名对象是指在创建对象时,只有创建的语句,却没有把对象地址值赋给某个变量. 特点: (1)匿名对象直接使用,没有变量名.当做形参使用. new Person().name=&quo ...

  3. python和shell间变量互相传递

    Python -> shell: 参考文章 1.环境变量 import os var=123或var=’123’ os.environ[’var’]=str(var) #environ的键值必须 ...

  4. 转:[译]CSV 注入:被人低估的巨大风险

    转:https://yq.aliyun.com/articles/225847 原文地址:The Absurdly Underestimated Dangers of CSV Injection 原文 ...

  5. Web后门工具WeBaCoo

    Web后门工具WeBaCoo   WeBaCoo是使用Perl语言编写的Web后门工具.渗透测试人员首先使用该工具生成一个后门PHP页面.然后,将该页面上传到目标服务器上.最后,在本地终端直接访问该页 ...

  6. luogu P4115 Qtree4

    题目链接 luogu P4115 Qtree4 题解 动态点分治,和上一题一样.同样三个堆.就是带权,用边权替换深度就好 为什么要单独写这个题解呢,因为我卡常卡了一天....据说树剖比rmq快? 在第 ...

  7. QTREEⅠ SPOJ

    树剖模板,注意把边化为点后要查到y的儿子. #include<bits/stdc++.h> using namespace std; ; int f[N],bel[N],w[N],id[N ...

  8. UOJ #30. [CF Round #278] Tourists

    UOJ #30. [CF Round #278] Tourists 题目大意 : 有一张 \(n\) 个点, \(m\) 条边的无向图,每一个点有一个点权 \(a_i\) ,你需要支持两种操作,第一种 ...

  9. [BZOJ3143][HNOI2013]游走(期望+高斯消元)

    3143: [Hnoi2013]游走 Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 3576  Solved: 1608[Submit][Status ...

  10. SpringMVC集成Swagger插件以及Swagger注解的简单使用

    一.简介 Swagger 是一个规范和完整的框架,用于生成.描述.调用和可视化 RESTful 风格的 Web 服务.总体目标是使客户端和文件系统作为服务器以同样的速度来更新 .接口的方法,参数和模型 ...