Bootstrap 允许您以两种方式显示代码：

  • 第一种是 <code> 标签。如果您想要内联显示代码，那么您应该使用 <code> 标签。
  • 第二种是 <pre> 标签。如果代码需要被显示为一个独立的块元素或者代码有多行，那么您应该使用 <pre> 标签。

请确保当您使用 <pre> 和 <code> 标签时，开始和结束标签使用了 unicode 变体： &lt; 和 &gt;。

<!DOCTYPE html>
<html>
<head>
  <title>Bootstrap 实例 - 代码</title>
  <link href="/bootstrap/css/bootstrap.min.css" rel="stylesheet">
  <script src="/scripts/jquery.min.js"></script>
  <script src="/bootstrap/js/bootstrap.min.js"></script>
</head>
<body>

<p><code>&lt;header&gt;</code> 作为内联元素被包围。</p>
<p>如果需要把代码显示为一个独立的块元素，请使用 <pre> 标签：</p>
<pre>
  &lt;article&gt;
    &lt;h1&gt;Article Heading&lt;/h1&gt;
  &lt;/article&gt;
</pre>
</body>
</html>

效果图：

【原创】bootstrap框架的学习 第六课[bootstrap代码]的更多相关文章

  1. 【原创】bootstrap框架的学习 第八课 -[bootstrap表单]

    Bootstrap 提供了下列类型的表单布局: 垂直表单(默认) 内联表单 水平表单 吹着表单或基本表单 向父 <form> 元素添加 role="form". 把标签 ...

  2. 【原创】bootstrap框架的学习 第七课 -[bootstrap表格]

    Bootstrap 表格 标签 描述 <table> 为表格添加基础样式. <thead> 表格标题行的容器元素(<tr>),用来标识表格列. <tbody& ...

  3. 【原创】bootstrap框架的学习 第五课

    一.Bootstrap 中定义了所有的 HTML 标题(h1 到 h6)的样式. <!DOCTYPE html> <html> <head> <title&g ...

  4. Python学习第六课

    Python学习第六课 课前回顾 列表 创建 通过 [] :写在[]里,元素之间用逗号隔开 对应操作: 查 增 append insert 改(重新赋值) 删除(remove del pop(删除后会 ...

  5. # go微服务框架kratos学习笔记六(kratos 服务发现 discovery)

    目录 go微服务框架kratos学习笔记六(kratos 服务发现 discovery) http api register 服务注册 fetch 获取实例 fetchs 批量获取实例 polls 批 ...

  6. Bootstrap框架的学习（一）

    一.Bootstrap框架介绍 Bootstrap是一个非常优秀的前端UI框架,一个轻量级的UI前端框架,是基于HTML+CSS+JavaScript的框架. 二.简单介绍 Bootstrap框架是属 ...

  7. Bootstrap框架的学习（二）

    一.下载Bootstrap Bootstrap (当前版本 v3.3.0)提供以下几种方式帮你快速上手,每一种方式针对具有不同技能等级的开发者和不同的使用场景. 下载地址:http://v3.boot ...

  8. Git速成学习第六课：Bug分支

    Git速成学习笔记整理于廖雪峰老师的官网网站:https://www.liaoxuefeng.com/ 当你接到一个修复代码为101的任务的时候,很自然的你想创建一个分支issue-101来修复它,但 ...

  9. Es学习第六课， ES基本搜索_search

    前面几课ES的基本概念.安装和分词都讲过了,下面我们就来实战一下ES的核心功能-搜索,这节课我们主要讲的是基本搜索 _search(注意:ES的关键字都要加前缀_,所以我们在定义索引.类型名称时不要带 ...

随机推荐

  1. hdoj1242(dfs 剪枝 解法)

    题意:拯救行动,天使r有多个朋友a(friends,在这里被坑了几次,没看清题意),天使被关在牢房里,等着朋友来拯救,求拯救天使的最短距离. 解法:如果不剪枝,200*200的地图会超时,可以以天使为 ...

  2. HTTP协议分析

    一.域名概述 1.域名解析的作用: 主机数量增多时,IP地址不容易记忆,域名方便记忆.域名记忆更加直观. 2.hosts文件 早期通过hosts文件进行域名的解析,Linux系统中hosts文件存放路 ...

  3. iOS SnapKit自动布局使用详解

    对于自动布局: 我们在 StoryBoard 中可以使用约束实现,简单明了,但如果用纯代码来设置约束就很麻烦了 OC里面,我们常用的有Masonry,SDAutoLayout Swift里,我们有Sn ...

  4. ADO.NET温习(一)

    ADO.NET概述 本节复习如何使用ADO.NET访问C#程序中的数据,主要介绍如何使用SqlConnection类和OleDbConnection类连接数据库,以及断开与数据库连接.深入讨论命令对象 ...

  5. ATM取款~~

    package com.jredu.ch03; import java.util.Scanner; public class Atmmmmmmmmmm { static int totalMoney= ...

  6. iOSiOS开发之退出功能（易错）

    如果,我们有两个控制器,第一个控制器是MainController,它是与Main.storyboard相关联的.第二个控制器是myController.假设myController中有一个退出按钮, ...

  7. jQuery购物车

    效果图 HTML代码:(非表格方式) <div class="nav2"> <input type="checkbox" class=&quo ...

  8. insmod: can't insert 'led.ko': invalid module format详细解释

    insmod: can't insert 'led.ko': invalid module format 之前在Imx257学习版固件编写的驱动想直接移植imx257核心板的开发板上.以为2个板子的源 ...

  9. NPM使用技巧

    如果你是一个JavaScript系的开发者,一定不会陌生NPM,它既是一个平台,也是一个工具.在这个平台上,我们能够使用其他开发者提供的功能代码,当然我们也能将我们自己代码提交到这里分享给世界上的开发 ...

  10. 在ASP.NET Core中使用Apworks开发数据服务：对HAL的支持

    HAL,全称为Hypertext Application Language,它是一种简单的数据格式,它能以一种简单.统一的形式,在API中引入超链接特性,使得API的可发现性(discoverable ...