这款插件的名字叫做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. command line subversion for windows

    安装 Slik SVN 之后,进入dos, 输入svn help,所有的命令和相关的信息都出来了   相关的svn命令:log.export等,可以搜索相应的文章: svn常用命令 svn log - ...

  2. Material Designer的低版本兼容实现（十）—— CheckBox & RadioButton

    ChekBox的用途我们就不必多说了,算是一个很古老的控件了,何其类似的还有RadioButton,这个东西因为我目前还没写出来,所以用了别人的一个lib,这下面会说到.顺便说一句,如果你的app是在 ...

  3. 多个类定义attr属性重复的问题:Attribute ＂xxx＂ has already been defined

    有时候做自定义控件时就会遇到命名冲突,改变有冲突的名字自然是最直接有效的方式,但是感觉很傻.我搜了下别人的解决方案,觉得很值得借鉴.就是把重名的属性,独立出来写一下,然后在定义时直接写属性名字即可. ...

  4. 再有人问你Java内存模型是什么，就把这篇文章发给他

    前几天,发了一篇文章,介绍了一下JVM内存结构.Java内存模型以及Java对象模型之间的区别.有很多小伙伴反馈希望可以深入的讲解下每个知识点.Java内存模型,是这三个知识点当中最晦涩难懂的一个,而 ...

  5. securecrt 多窗口执行命令

    首先在SecureCRT里同时打开多个服务器session(必须是有相同目录结构) 选择菜单栏View –>Chat Windows 对号,此时所有服务器连接下方应该有个空白的部分 在空白的部分 ...

  6. 微信Access Token 缓存方法

    微信Access Token默认缓存是2小时,但是需要特别强调,微信服务号和微信企业号缓存并不相同. (1)微信公众号号:每次Http请求Access Token 系统会返回不同的Token,并附带超 ...

  7. Mac下的Docker及Kubernetes(k8s)本地环境搭建与应用部署、管理界面kubernetes-dashboard

    mac安装docker: brew cask install docker 当然也可以直接去官网下载docker的pkg文件安装 mac的docker国内镜像:网易的镜像地址:http://hub-m ...

  8. Asp.net WebAPI Request参数验证-请不要重复造轮子

    随着web客户端的发展,现在很多公司都有专业的前端开发,做到系统前后端分离.ap.net后端典型的就是采用webapi,但是发现很多时候大家对webapi并不了解,这里我们来说说输入参数的验证.前一段 ...

  9. IO流 简介 总结 API 案例 MD

    目录 IO 流 简介 关闭流的正确方式 关闭流的封装方法 InputStream 转 String 的方式 转换流 InputStreamReader OutputStreamWriter 测试代码 ...

  10. 构建配置 ProGuard Shrink 混淆和压缩

    官方文档 压缩代码和资源 要尽可能减小 APK 文件,您应该启用压缩来移除 release build 中未使用的代码和资源.此页面介绍如何执行该操作,以及如何指定要在构建时保留或舍弃的代码和资源. ...