In bootstrap, we can use a different type of HTML elements such as <code>, <kbd>, <pre>, <var> etc., to change the style of inline and multiline code blocks depending on how you want to represent the code blocks.
In bootstrap, we can use <code> element to wrap the inline snippets of code like as shown below.
If you observe the above code, we wrapped inline snippets of code with <code> element based on our requirements.
The above example will return the result as shown below.
While using <code> element to wrap inline snippets code, you need to make sure to escape HTML angle brackets as shown below.
The above code will return the result as shown below.
To wrap multiple lines of code, use <pre> element in bootstrap. To render code block properly, you need to escape HTML angle brackets the same like <code> element.
If you observe the above example, we wrapped multiple lines of code using <pre> element.
The above example will return the result as shown below.
This is how we can use <pre> element to wrap multiple lines of code in bootstrap.
In bootstrap, use <kbd> element to indicate input that is typically entered via the keyboard, as shown below.
If you observe the above code, we used <kbd> element to indicate input that is typically entered from the keyboard.
The above example will return the result as shown below.
In bootstrap, to indicate the variables in your code, use <var> tag. The <var> tag will render the content in italic font.
The above example will return the result as shown below.
x + y + z = 20
In bootstrap, to indicate the sample output from a program using <samp> tag as shown below.
The above example will return the result as shown below.
This is how we can use different tag elements to show inline or multiline blocks of code in bootstrap.