Bootstrap Code
Bootstrap allows you to display code in two ways:
- The first is the <code> tag. If you want to display code inline, then you should use the <code> tag.
- The second is the <pre> tag. If the code needs to be displayed as a separate block element or the code has multiple lines, then you should use the <pre> tag.
Please ensure that when you use the <pre> and <code> tags, the opening and closing tags use Unicode variants: <and>。
Let's take a look at the following example:
Example
<p><code><header></code>is wrapped as an inline element.</p>
<p>If you need to display the code as a separate block element, please use<pre>tag:</p>
<pre>
<article>
<h1>Article Heading</h1>
</article>
</pre>
Try it yourself »
The example is shown in the figure below:
More Examples
| Element/Class | Description | Example |
|---|---|---|
| <var> | Variable assignment:x = ab + y | Try it yourself |
| <kbd> | Keyboard input:CTRL + P | Try it yourself |
| <pre> | Multiple lines of code | Try it yourself |
| <pre class="pre-scrollable"> | Multiple lines of code with scrollbar | Try it yourself |
| <samp> | Computer program output:Sample output | Try it yourself |
| <code> | Code snippet on the same line:span, div |
Try it yourself |