zoukankan      html  css  js  c++  java
  • 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>

    效果:

  • 相关阅读:
    webpack配置之代码优化
    react组件生命周期
    javascript记住用户名和登录密码
    ajax异步请求原理和过程
    深入理解ajax系列第五篇——进度事件
    ajax多次请求,只执行最后一次的方法
    CentOS6.8下MySQL MHA架构搭建笔记
    HTTP状态码
    什么是 Redis 事务?原理是什么?
    Redis 通讯协议是什么?有什么特点?
  • 原文地址:https://www.cnblogs.com/keiling/p/3635467.html
Copyright © 2011-2022 走看看