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.
- Multiline comments in Python
- What is the difference between display: inline and display: inline-block in CSS?
- What is the difference between inline-flex and inline-block in CSS?
- How to Display Validation Message for Radio Buttons with Inline Images using Bootstrap 4 ?
- Displaying XML Using CSS
- Displaying XML Using XSLT
- Bootstrap (Part-4) | Vertical Forms, Horizontal Forms, Inline Forms
- Perl | Displaying Variable Values with a Debugger
- Include Bootstrap in AngularJS using ng-bootstrap
- Difference between bootstrap.css and bootstrap-theme.css
- Difference Between Bootstrap 3 and Bootstrap 4
- Difference between Bootstrap 4 and Bootstrap 5
- How to universally parse JSON into blocks using jQuery ?
- Check if the binary representation of a number has equal number of 0s and 1s in blocks
- Blocks in PL/SQL
- Minimum cost to build N blocks from one block
- Node.js stats.blocks Property from fs.Stats Class
- How to Shift Inline Elements When Text Bold on Hover using CSS ?
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to email@example.com. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.