当前位置：首页 > 程序&理念 >

手把手教你用google-code-prettify进行代码高亮

时间：2016-04-15 01:02:34浏览：3491 转载百度经验

使用google-code-prettify可以用来很方便地对网页中的程序代码进行高亮显示,从而在视觉上使得网页上的代码看得比较舒服,这对网站站长来说是很重要的。

有两种方法来启用google-code-prettify,下面简要介绍一下步骤。

先来看看方法一的步骤:

(1) 从https://code.google.com/p/google-code-prettify/downloads/list中下载或者从http://www.bluecode.cn/js/GoogleCodePrettify/google-code-prettify.zip 中打包下载pretty.css以及pretty.js,并保存到本地服务器的相应目录中来引用

(2) 引用pretty.css以及pretty.js,然后在网页中引用,引用方法为

<link href="你保存的目录/prettify.css" type="text/css" rel="stylesheet" />

<script type="text/javascript" src="你保存的目录/prettify.js"></script>

(3) <body>标签改为<body onload="prettyPrint()">

(4) 将源代码用标签

<pree class="prettyprint">这是你的代码</pre>

包含起来,例如

<pre class="prettyprint">

#include "x.h"

main(){

    print("hello world!");

}

</pre>




以下是方法二的步骤:

(1) 到网址 https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js 中或者从http://www.colafile.com/file/145957 下载run_prettify.js文件

(2) 引用run_prettify.js文件,方法为

<script src="https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js"></script>

或者

<script src="你保存的目录/run_prettify.js"></script>

(3) 将源代码用标签

<pre class="prettyprint">这是你的代码</pre>

包含起来,例如

<pre class="prettyprint">

#include "x.h"

main(){

    print("hello world!");

}

</pre>




上一篇：抓包工具Fidder详解(主要来抓取Android中app的请求)
下一篇：终于正在审核了，希望能顺利通过

发表评论

昵称：  验证码：

关于博主

博主

博主：BlueCode

职业：web程序

简介：2002年开始一直从事Web制作，网站运营，会PHP+MYSQL ASP+MSSQL，微信开发

  • Linux文章
  • PHP文章
  • 随机文章