twbs--bootstrap/docs/content/code.md

1.5 KiB

layout title description group
docs Code Documentation and examples for displaying inline and multiline blocks of code with Bootstrap. content

Styles for inline code snippets and longer, multiline blocks of code.

Contents

  • Will be replaced with the ToC, excluding the "Contents" header {:toc}

Inline code

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

{% example html %} For example, <section> should be wrapped as inline. {% endexample %}

Code blocks

Use <pre>s for multiple lines of code. Once again, be sure to escape any angle brackets in the code for proper rendering. You may optionally add the .pre-scrollable class, which will set a max-height of 350px and provide a y-axis scrollbar.

{% example html %}

<p>Sample text here...</p>
<p>And another line of sample text here...</p>

{% endexample %}

Variables

For indicating variables use the <var> tag.

{% example html %} y = mx + b {% endexample %}

User input

Use the <kbd> to indicate input that is typically entered via keyboard.

{% example html %} To switch directories, type cd followed by the name of the directory.
To edit settings, press ctrl + , {% endexample %}

Sample output

For indicating sample output from a program use the <samp> tag.

{% example html %} This text is meant to be treated as sample output from a computer program. {% endexample %}