BootStrap2学习日记6---代码

&lt；表示“<”

&gt；表示“>”

在BootStrap中标记代码的标签使用<code>,标记代码块使用<pre>(里面的代码特殊标签必须转义)

下面我们看一个例子

代码：

<body>
<div class="container">
  <h1 class="page-header">代码</h1>
  <p>这是一个<code>&lt;h1&gt;</code>标签<code>int temp=0;</code></p>
  <pre ><code>&lt;dl class=&quot;dl-horizontal&quot;&gt;
  &lt;dt&gt;Mybatis&lt;/dt&gt;
  &lt;dd&gt;MyBatis 是支持普通 SQL查询，存储过程和高级映射的优秀持久层框架。&lt;/dd&gt;
  &lt;dt&gt;Spring&lt;/dt&gt;
  &lt;dd&gt;Spring是一个开源框架，Spring 是于2003 年兴起的一个轻量级的Java。&lt;/dd&gt;  
  &lt;dt&gt;MVC&lt;/dt&gt; 
  &lt;dd&gt;模型－视图－控制器一种软件设计模式。&lt;/dd&gt;
&lt;/dl&gt;</code></pre>
</div>

效果：

使用goole-prettify下载地址：https://code.google.com/p/google-code-prettify/downloads/detail?name=prettify-small-4-Mar-2013.tar.bz2&can=2&q=

使用：

1.下载后解压

2.在页面导入prettify.css，prettify.js

3.<pre class="prettyprint linenums"> 在pre中使用2个类第一个是渲染关键词颜色格式；第二个是给代码添加行号

4.最后在body标签中添加 onLoad="prettyPrint()"

代码：

<body onLoad="prettyPrint()">
<div class="container">
  <h1 class="page-header">代码</h1>
  <p>这是一个<code>&lt;h1&gt;</code>标签<code>int temp=0;</code></p>
  <pre class="prettyprint linenums"><code>&lt;dl class=&quot;dl-horizontal&quot;&gt;
  &lt;dt&gt;Mybatis&lt;/dt&gt;
  &lt;dd&gt;MyBatis 是支持普通 SQL查询，存储过程和高级映射的优秀持久层框架。&lt;/dd&gt;
  &lt;dt&gt;Spring&lt;/dt&gt;
  &lt;dd&gt;Spring是一个开源框架，Spring 是于2003 年兴起的一个轻量级的Java。&lt;/dd&gt;  
  &lt;dt&gt;MVC&lt;/dt&gt; 
  &lt;dd&gt;模型－视图－控制器一种软件设计模式。&lt;/dd&gt;
&lt;/dl&gt;</code></pre>
</div>

效果:

相关阅读:
[BZOJ4755][JSOI2016]扭动的回文串(manacher+Hash)
十二省联考2019部分题解
[BZOJ2959]长跑(LCT+并查集)
[BZOJ4541][HNOI2016]矿区(平面图转对偶图)
笛卡尔树
[CF896C]Willem, Chtholly and Seniorious(珂朵莉树)
[BZOJ4349]最小树形图
[BZOJ1858][SCOI2010]序列操作(线段树)
[PA2014]Parking
[PA2014]Budowa

原文地址：https://www.cnblogs.com/keiling/p/3635467.html