Displaying inline and multiline blocks of code using Bootstrap
Bootstrap provides a number of classes for displaying inline and multiline blocks of code.
Displaying Inline Code: Inline code should be wrapped in <code> tags. The resulting text will be displayed in a fixed-width font and given a red font color.
> tags should be replaced with < and > respectively.
Below is an example displaying inline code using <code> tags in Bootstrap:
Displaying Multiline Code Blocks: Multiline code should be wrapped in
<pre> tags. The resulting text will be displayed in a fixed-width font with spaces and line breaks being preserved.
.pre-scrollable class can be optionally added which sets the max height of the element to be 350px and adds a vertical scrollbar.
Below is an example displaying block of code:
Indicating Sample Output: If it is needed to display output of any compiled program, in that case to indicate the output of a program, one can wrap the output using
Representing Variables: Variables could be indicated using the
User Input: User input could be styled using the
<kbd> tags as shown in the below program.