Bootstrap – Code

In bootstrap we have two different ways through which we can display a code. The following are the ways through which code can be displayed in bootstrap:

  1. By using the < code> tag. If the user wants to display the code inline then he should use the <code> tag.
  2. By using the <pre> tag. If the user wants to display the code in multiple lines or the code has a number of lines then the <pre> tag should be used.

When the <code> and <pre> tags are used it should be ensured that you are using the Unicode variants for both opening and closing tags. The Unicode variants are &lt; and &gt;.

Consider the following example in which we have used the <code > and < pre> tags along with the Unicode variants:

CODE:

<! DOCTYPE html >

<html>

<head>

<title> Bootstrap Example </ title >

<linkhref = “/ bootstrap / css/ bootstrap. min. css” rel = “stylesheet” >

<scriptsrc = “/ scripts/ jquery. min. js” ></ script >

<scriptsrc = “/ bootstrap /js / bootstrap. min. js” >< /script >

</ head >

<body>

<p><code>&lt;br&gt;</code> is used to generate a line break.

</p>

<p>The &lt;pre&gt; tag is used to display the code in multiple lines.

</p>

<pre>

&lt;article&gt;

&lt;h1&gt;Heading of the article&lt;/h1&gt;

&lt;/article&gt;

</pre>

</ body >

</ html>

The above code will generate the following result:

OUTPUT:

OUTPUT

It can be seen in the above example the code in one line the <code> element is used and the Unicode variants are used to display the coding on the webpage. To display the code on multiple lines on the page we used the <pre> tag and to display the tags on the webpage Unicode variants are used.