天天看点

Bootstrap 代码

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

第一种是 <code> 标签。如果您想要内联显示代码,那么您应该使用 <code> 标签。

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

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

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

&lt;p&gt;&lt;code&gt;&amp;lt;header&amp;gt;&lt;/code&gt; 作为内联元素被包围。&lt;/p&gt;

&lt;p&gt;如果需要把代码显示为一个独立的块元素,请使用 &amp;lt;pre&amp;gt; 标签:&lt;/p&gt;

&lt;pre&gt;

&amp;lt;article&amp;gt;

&amp;lt;h1&amp;gt;Article Heading&amp;lt;/h1&amp;gt;

&amp;lt;/article&amp;gt;

&lt;/pre&gt;

实例展示如下图:

Bootstrap 代码

元素/类

描述

实例

&lt;var&gt;

变量赋值: x = ab + y

&lt;kbd&gt;

按键提示: CTRL + P

多行代码

&lt;pre class="pre-scrollable"&gt;

多行代码带有滚动条

&lt;samp&gt;

电脑程序输出: Sample output

&lt;code&gt;

同一行代码片段: <code>span</code>, <code>div</code>