这款插件的名字叫做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. jquery重置

    在使用jquery时要先引用 <script type="text/javascript" src="/Themes/Default/Js/jquery-1.11. ...

  2. iBatis应用--控制执行SQL时的超时时间

    https://blog.csdn.net/jackie_xiaonan/article/details/8459320

  3. 如何设计一个基于Node.js和Express的网站架构?

    前言 今年七月份,我和几个小伙伴们合伙建立了一个开发团队.业务开展如火如荼的同时,团队宣传就提上了日程,所以迫切需要搭建公司网站出来.确定目标后我们就开始考虑如果构建一个企业网站.先是进行业内调查,看 ...

  4. Python并发编程-信号量

    信号量保证同一资源同一时间只能有限定的进程去访问 一套资源,同一时间,只能被n个人访问 某一段代码,同一时间,只能被n个进程执行 from multiprocessing import Process ...

  5. SSM相关资料

    MyBatis: 官方文档 MyBatis-Spring:官方文档 SpringMVC整合MyBatis实例 SSM框架详细整合教程 一步一步带你搭建后台管理系统之SSM框架整合 SSM框架入门和搭建 ...

  6. Xcode_7_GM_seed.dmg下载

    Xcode_7_GM_seed.dmg下载     Xcode_7_GM_seed.dmg  免费下载链接: http://pan.baidu.com/s/1pJ7oGAZ 密码: y5bx

  7. python语言特性总结

    一直想学习python,虽然编程写了不少,但有时仍不得要领.这篇blog主要是记录python的一些主要特性. 前言 python学习总结,包括python的一些基本语法,高级特性,函数式编程,面向对 ...

  8. python爬虫(1)——BeautifulSoup库函数find_all() (转)

    原文地址:http://blog.csdn.net/depers15/article/details/51934210 python--BeautifulSoup库函数find_all() 一.语法介 ...

  9. java爬虫爬取资源,小白必须会的入门代码块

    java作为目前最火的语言之一,他的实用性也在被无数的java语言爱好者逐渐的开发,目前比较流行的爬取资源,用java来做也更简单一些,下面是爬取网页上所有手机型号,参数等极为简便的数据 packag ...

  10. java开发_mysql中获取数据库表描述_源码下载

    功能描述: 在mysql数据库中,有两张表: data_element_config , test_table 我们需要获取表:test_table表的描述信息,然后把描述信息插入到表:data_el ...