Documentation

Displaying inline and multiline blocks of code.

Bootstrap docs

Inline code

Wrap inline snippets of code with <code>. Be sure to escape HTML angle brackets.

<p>Wrap inline snippets of code with <code>&lt;code&gt;</code>.</p>
p Wrap inline snippets of code with <code>&lt;code&gt;</code>.
                    

User input

To switch directories, type cd followed by the name of the directory.
To edit settings, press ctrl + ,

<p>
                      To switch directories, type <kbd>cd</kbd> followed by the name of the directory.
                      To edit settings, press <kbd><kbd>ctrl</kbd> + <kbd>,</kbd></kbd>
                    </p>
p
                      | To switch directories, type <kbd>cd</kbd> followed by the name of the directory.
                      | To edit settings, press <kbd><kbd>ctrl</kbd> + <kbd>,</kbd></kbd>
                    

Variables

y = mx + b
<var>y</var> = <var>mx</var> + <var>b</var>
var y
                      | =
                      var mx
                      | +
                      var b
                    

Code block

<p>Sample text here...</p>
<p>And another line of sample text here...</p>
<pre>
                      <code>&lt;p&gt;Sample text here...&lt;/p&gt;
                      &lt;p&gt;And another line of sample text here...&lt;/p&gt;</code>
                    </pre>
pre
                      code
                      &lt;p&gt;Sample text here...&lt;/p&gt;
                      &lt;p&gt;And another line of sample text here...&lt;/p&gt;
                    

Code block scrollable

<div class="table-responsive">
                      <table class="table">
                      <thead>
                      <tr>
                      <th>#</th>
                      <th>First Name</th>
                      <th>Last Name</th>
                      <th>Position</th>
                      <th>Phone</th>
                      </tr>
                      </thead>
                      <tbody>
                      <tr>
                      <th scope="row">1</th>
                      <td>John</td>
                      <td>Doe</td>
                      <td>CEO, Founder</td>
                      <td>+3 555 68 70</td>
                      </tr>
                      <tr>
                      <th scope="row">2</th>
                      <td>Anna</td>
                      <td>Cabana</td>
                      <td>Designer</td>
                      <td>+3 434 65 93</td>
                      </tr>
                      <tr>
                      <th scope="row">3</th>
                      <td>Kale</td>
                      <td>Thornton</td>
                      <td>Developer</td>
                      <td>+3 285 42 88</td>
                      </tr>
                      <tr>
                      <th scope="row">4</th>
                      <td>Jane</td>
                      <td>Birkins</td>
                      <td>Support</td>
                      <td>+3 774 28 50</td>
                      </tr>
                      </tbody>
                      </table>
                    </div>
<pre class="pre-scrollable">
                      <code>
                      Code goes here...
                      </code>
                    </pre>
pre.pre-scrollable
                      code.
                      | Code goes here...
                    

Code highlighting

<div class="table-responsive">
                      <table class="table">
                      <thead>
                      <tr>
                      <th>#</th>
                      <th>First Name</th>
                      <th>Last Name</th>
                      <th>Position</th>
                      <th>Phone</th>
                      </tr>
                      </thead>
                      <tbody>
                      <tr>
                      <th scope="row">1</th>
                      <td>John</td>
                      <td>Doe</td>
                      <td>CEO, Founder</td>
                      <td>+3 555 68 70</td>
                      </tr>
                      <tr>
                      <th scope="row">2</th>
                      <td>Anna</td>
                      <td>Cabana</td>
                      <td>Designer</td>
                      <td>+3 434 65 93</td>
                      </tr>
                      <tr>
                      <th scope="row">3</th>
                      <td>Kale</td>
                      <td>Thornton</td>
                      <td>Developer</td>
                      <td>+3 285 42 88</td>
                      </tr>
                      </tbody>
                      </table>
                    </div>
<pre class="line-numbers">
                      <code class="lang-html">
                      HTML code goes here...
                      </code>
                    </pre>
pre.line-numbers
                      code.lang-html.
                    | HTML code goes here...
Top