InterviewSolution
Saved Bookmarks
| 1. |
How to display code with Bootstrap? |
|
Answer» To display code with Bootstrap, work with the <code> tag. With that, we can also use the <pre> tag. The <code> tag For inline code, use the <code> tag. Here, we are displaying a header file code: <!DOCTYPE html> <html lang="en"> <head> <title>Bootstrap Code</title> <meta charset="utf-8"> <meta NAME="VIEWPORT" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> </head> <body> <div class="container mt-3"> <h2>C PROGRAMMING</h2> <p>The following is the header file for C language:</p> <code>#include <stdio.h></code> <p>The following is the header file for C++ language:</p> <code>#include <iostream></code> </div> </body> </html>The output displays code. In our case, it is only a header file: The <pre> tag If the code has multiple lines, then use the <pre> tag: <!DOCTYPE html> <html lang="en"> <head> <title>Bootstrap Code</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> </head> <body> <div class="container mt-3"> <h2>Codes </h2> <p>The following is the header file for C language:</p> <code>#include <stdio.h></code> <p>The following is the usage of fieldset ELEMENT:</p> <pre> <form> <fieldset> <legend>Details:</legend> Name: <input type="text"><br> EMAIL: <input type="text"><br> </fieldset> </form> </pre> </div> </body> </html>The output shows the code in multiple lines: |
|