一般在个人博客上使用的较为频繁,用于显示代码的风格。在Bootstrap主要提供了三种代码风格:
1、使用<code></code>来显示单行内联代码
2、使用<pre></pre>来显示多行块代码
3、使用<kbd></kbd>来显示用户输入代码

预编译版本的Bootstrap将代码的样式单独提取出来:
1、LESS版本,请查阅code.less文件
2、Sass版本,请查阅_code.scss文件
编译出来的CSS代码请查阅bootstrap.css文件第688行~第730行,由于代码太长,此处不一一列举。

在使用代码时,用户可以根据具体的需求来使用不同的类型:
1、<code>:一般是针对于单个单词或单个句子的代码
2、<pre>:一般是针对于多行代码(也就是成块的代码)
3、<kbd>:一般是表示用户要通过键盘输入的内容

虽然不同的类型风格不一样,但其使用方法是类似的。
code风格:

<div>Bootstrap的代码风格有三种:
<code>&lt;code&gt;</code>
<code>&lt;pre&gt;</code>
<code>&lt;kbd&gt;</code>
</div>

pre风格:

<div>
<pre>
&lt;ul&gt;
&lt;li&gt;...&lt;/li&gt;
&lt;li&gt;...&lt;/li&gt;
&lt;li&gt;...&lt;/li&gt;
&lt;/ul&gt;
</pre>
</div>

kbd风格:

<div>请输入<kbd>ctrl+c</kbd>来复制代码,然后使用<kbd>ctrl+v</kbd>来粘贴代码</div>

不管使用哪种代码风格,在代码中碰到小于号(<)要使用硬编码“&lt;”来替代,大于号(>)使用“&gt;”来替代。而且对于<pre>代码块风格,标签前面留多少个空格,在显示效果中就会留多少个空格。

bootstrap代码(一)的更多相关文章

  1. Bootstrap 代码

    [Bootstrap 代码] Bootstrap 允许您以两种方式显示代码: 第一种是 <code> 标签.如果您想要内联显示代码,那么您应该使用 <code> 标签. 第二种 ...

  2. 【原创】bootstrap框架的学习 第六课[bootstrap代码]

    Bootstrap 允许您以两种方式显示代码: 第一种是 <code> 标签.如果您想要内联显示代码,那么您应该使用 <code> 标签. 第二种是 <pre> 标 ...

  3. !!!常用bootstrap代码

    http://v3.bootcss.com/components/  组件 http://v3.bootcss.com/customize/  bootstrap定制 http://v3.bootcs ...

  4. bootstrap学习笔记--bootstrap组件

    前面已经学习了bootstrap环境搭建以及基本布局方面的知识,下面将学习下关于bootstrap的相关组件,知识点有点多. 关于bootstrap组件知识点目录: Bootstrap--代码显示 B ...

  5. bootstrap学习笔记--bootstrap布局方式

    Bootstrap 3 是移动设备优先的,在这个意义上,Bootstrap 代码从小屏幕设备(比如移动设备.平板电脑)开始,然后扩展到大屏幕设备(比如笔记本电脑.台式电脑)上的组件和网格. 移动设备优 ...

  6. 使用外部web组件-----easyUI、jQueryUI、Bootstrap、js正则表达式

    1.使用外部web组件,以Bootstrap为例 <head> <link rel='stylesheet'  href='bootstrap-3.3.0-dist/dist/css ...

  7. <<Bootstrap基础教程>> 新书出手,有心栽花花不开,无心插柳柳成荫

    并非闲的蛋疼,做技术也经常喜欢蛋疼,纠结于各种技术,各种需求变更,还有一个很苦恼的就是UI总是那么不尽人意.前不久自己开源了自己做了多年的仓储项目(开源地址:https://github.com/he ...

  8. Bootstrap<基础二> 网格系统

    Bootstrap 提供了一套响应式.移动设备优先的流式网格系统,随着屏幕或视口(viewport)尺寸的增加,系统会自动分为最多12列. 什么是网格(Grid)? 摘自维基百科: 在平面设计中,网格 ...

  9. bootstrap弹框

    http://v3.bootcss.com/javascript/#modals 参考bootstrap官网 模态框做php后端 前端一直不行,但是很多时候 用到ajax都要用到弹框,一直在代码里面找 ...

随机推荐

  1. 12. pt-index-usage

    pt-index-usage h=192.168.100.101,P=3306,u=admin,p=admin /data/mysql3306/data/slow.log 根据slow log来判断i ...

  2. 【已处理完】Centos 6.5版本,df -h出来的容量与du -sh的容量不对应是怎么会事呢?

    问题如题,df -h 出来的容量与du -sh 查看的容量信息不一样,是那里出了问题了吗? 下面分别是du -sh *与df -h出来的结果 [root@mail /]# du -sh * 6.2M ...

  3. Spring Environment(一)API 介绍

    Spring Environment(一)API 使用 Spring 系列目录(https://www.cnblogs.com/binarylei/p/10198698.html) Spring 3. ...

  4. jquery单行文字上下循环滚动

    html代码: <div class="box"> <div class="t_news"> <b>已关联奖励账号.昵称:& ...

  5. 实现SQL express版做自动备份数据库的方法

    SQL Server 2005/2008 Express版没有代理组件,不支持维护计划.可以采用下面的办法实现每日备份: 一.在要备份的数据库中创建存储过程. 存储过程名称:sp_BackupData ...

  6. kbmmw ORM 对象定义语法简析

    使用kbmmw 的ORM 一定先要了解ORM 的对象定义语法. 下面简单说一下 // kbmMW_Table - Define a table. 定义一个表 // Must be used on cl ...

  7. 【转】linux tar 压缩

    tar -c: 建立压缩档案-x:解压-t:查看内容-r:向压缩归档文件末尾追加文件-u:更新原压缩包中的文件 这五个是独立的命令,压缩解压都要用到其中一个,可以和别的命令连用但只能用其中一个.下面的 ...

  8. RAID : 独立磁盘冗余阵列(Redundant Array of Independent Disks)

    RAID 分为不用的等级(RAID0 - RAID5),以满足不同的数据应用需求. RAID 是由多个独立的高性能磁盘驱动器组成的磁盘子系统,从而提供比单个磁盘更高的存储性能和数据冗余的技术. AID ...

  9. 2018.11.03 NOIP模拟 图(bfs/最短路)

    传送门 显然如果AAA到BBB或者CCC到DDD走的不是最短路一定是有一段路径重合了,于是可以O(n2)bfsO(n^2)bfsO(n2)bfs出两点之间的最短距离然后枚举两个点作为重合的端点来更新答 ...

  10. jquery遍历之parent()与parents()的区别 及 parentsUntil() 方法

    来自:http://blog.csdn.net/zm2714/article/details/8117746 .parent(selector) 获得当前匹配元素集合中每个元素的父元素,由选择器筛选( ...