ylbtech-Bootstrap-CSS:代码
1.返回顶部
1、

Bootstrap 代码

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

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

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

让我们来看看下面的实例:

实例

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

尝试一下 »

实例展示如下图:


更多实例

元素/类 描述 实例
<var> 变量赋值: x = ab + y 尝试一下
<kbd> 按键提示: CTRL + P 尝试一下
<pre> 多行代码 尝试一下
<pre class="pre-scrollable"> 多行代码带有滚动条 尝试一下
<samp> 电脑程序输出: Sample output 尝试一下
<code> 同一行代码片段: spandiv 尝试一下
2、
2.返回顶部
 
3.返回顶部
 
4.返回顶部
 
5.返回顶部
1、
2、
 
11.返回顶部
 
作者:ylbtech
出处:http://ylbtech.cnblogs.com/
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。

Bootstrap-CSS:代码的更多相关文章

  1. Bootstrap CSS 栅格、代码和表格

    一.bootstrap栅格 Bootstrap 提供了一套响应式.移动设备优先的流式网格系统,随着屏幕或视口(viewport)尺寸的增加,系统会自动分为最多12列. Bootstrap 网格系统(G ...

  2. Bootstrap CSS概览代码文字标注篇

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  3. Bootstrap CSS 描述

    <!DOCTYPE html><html lang="zh-CN"><head> <!--定于内容,和内容的编码格式--> < ...

  4. (二)Bootstrap CSS 概览

    在这一章中,我们将讲解 Bootstrap 底层结构的关键部分,包括我们让 web 开发变得更好.更快.更强壮的最佳实践. HTML 5 文档类型(Doctype) Bootstrap 使用了一些 H ...

  5. bootstrap.css.map这个文件有何用处?该怎能使用它?

    . ├── bootstrap.css ├── bootstrap.css.map ├── bootstrap.min.css ├── bootstrap-theme.css ├── bootstra ...

  6. web前端代码规范——css代码规范

    Bootstrap CSS编码规范 语法 用两个空格来代替制表符(tab) -- 这是唯一能保证在所有环境下获得一致展现的方法. 为选择器分组时,将单独的选择器单独放在一行. 为了代码的易读性,在每个 ...

  7. angular 实现modal windows效果(即模态窗口,半透明的遮罩层),以及bootstrap(css,components,js)的初步学习

    废话不说,直接上代码.可直接看效果,对着分析..今天算是bootstrap 入门了,开心.. 突然居然很多事情就是那样,不要太多的畏惧,迈出第一步其实就成功了一半了. <html ng-app= ...

  8. 8.Bootstrap CSS编码规范

    Bootstrap CSS编码规范 本节的介绍内容为 Bootstrap 中的 CSS 编码规范. 语法 用两个空格来代替制表符(tab) -- 这是唯一能保证在所有环境下获得一致展现的方法. 为选择 ...

  9. 3.Bootstrap CSS 概述

    1.HTML 5 文档类型(Doctype) Bootstrap 使用了一些 HTML5 元素和 CSS 属性.为了让这些正常工作,您需要使用 HTML5 文档类型(Doctype). 因此,请在使用 ...

  10. 2.Bootstrap CSS

    Bootstrap CSS 一.Bootstrap CSS概览 移动设备优先 移动设备优先是 Bootstrap 3 的最显著的变化. 在之前的 Bootstrap 版本中(直到 2.x),您需要手动 ...

随机推荐

  1. Maven错误 diamond operator is not supported in -source 1.5 (use -source 7 or higher to enable diamond operator)问题解决

    如果在Maven构建时出现: diamond operator is not supported in -source 1.5 (use -source 7 or higher to enable d ...

  2. IOS --关于粘贴板 ,剪切板 ,UILabel的复制

    在iOS中下面三个控件,自身就有复制-粘贴的功能: 1.UITextView 2.UITextField 3.UIWebView UIKit framework提供了几个类和协议方便我们在自己的应用程 ...

  3. Docker资源限制实现——cgroup

    摘要 随着Docker技术被越来越多的个人.企业所接受,其用途也越来越广泛.Docker资源管理包含对CPU.内存.IO等资源的限制,但大部分Docker使用者在使用资源管理接口时往往还比较模糊. 本 ...

  4. 【hibernate】报错:org.springframework.dao.DataIntegrityViolationException: could not execute statement; SQL [n/a]; nested exception is org.hibernate.exception.DataException: could not execute statement

    报错如下: org.springframework.dao.DataIntegrityViolationException: could not execute statement; SQL [n/a ...

  5. Go -- 实现二叉搜索树

    树: https://suanfa.herokuapp.com/3%E6%A0%91/binarytree/ 数据结构 首先我们定义需要的数据结构.注意,TreeNode的左右节点都是*TreeNod ...

  6. Java中的Copy-on-Write容器 & ConcurrentHashMap & HashTable比较

    参考这篇文章:Link 从JDK1.5开始Java并发包里提供了两个使用CopyOnWrite机制实现的并发容器,它们是CopyOnWriteArrayList和CopyOnWriteArraySet ...

  7. 在Nginx上部署ThinkPHP,解决Pathinfo问题

    在Nginx上部署ThinkPHP,解决Pathinfo问题 事实上.要解决nginx不支持pathinfo的问题.有两个解决思路,一是不使用pathinfo模式,二是改动nginx的配置文件,使它支 ...

  8. Visual Studio VS2013模块对于SAFESEH 映像是不安全的 怎么办

    打开该项目的"属性页"对话框,会出现如下界面打开该项目的"属性页"对话框,会出现如下界面   然后单击"链接器"--"命令行&qu ...

  9. row and col

    1.行 <Row gutter={{ md: 6, lg: 12, xl: 12 }}></Row> gutter: md: 中等屏幕 桌面显示器 (≥992px) lg: 大 ...

  10. eclipse中progress一直在刷新问题处理