basic html tags

by merganser

HTML

<h1>
  Single Carrige Return - &lt;br&gt;
</h1>
<h3>
Code
</h3>
<p>
  <pre>
  <code contenteditable spellcheck="false">
    First line of text <b>&lt;br&gt;</b> Second line of text    
  </code>
  </pre>
</p>
<h3>
Renders
</h3>
<p>

  First line of text <br> Second line of text    

</p>


<hr>

<h1>
  Double Carrige Return - &lt;p&gt;&lt;/p&gt;
</h1>
<h3>
Code
</h3>
<p>
  <pre>
  <code contenteditable spellcheck="false">
    <b>&lt;p&gt;</b>
      First line of text
    <b>&lt;/p&gt;</b>
    <b>&lt;p&gt;</b>
      Second line of text
    <b>&lt;/p&gt;</b>
  </code>
  </pre>
</p>

<h3>
Renders
</h3>
<p>
  First line of text
</p>
<p>
  Second line of text
</p>





<hr>




<h1>
  Bold Text - &lt;b&gt;&lt;/b&gt;
</h1>
<h3>
Code
</h3>
<p>
  <pre>
  <code contenteditable spellcheck="false">
    <b>&lt;b&gt;</b>
      Bold text
    <b>&lt;/b&gt;</b>   
  </code>
  </pre>
</p>

<h3>
Renders
</h3>
<b>
      Bold text
   </b>
   
   
   
   
  
<hr> 
   
   




<h1>
  Numbered List - &lt;ol&gt;&lt;li&gt;&lt;/li&gt;&lt;/ol&gt;
</h1>
<h3>
Code
</h3>
<p>
  <pre>
  <code contenteditable spellcheck="false">
    <b>&lt;ol&gt;</b>
    <b>&lt;li&gt;</b>Item 1<b>&lt;/li&gt;</b>
    <b>&lt;li&gt;</b>Item 2<b>&lt;/li&gt;</b>
    <b>&lt;/ol&gt;</b>  
  </code>
  </pre>
</p>

<h3>
Renders
</h3>
<ol>
<li>Item 1</li>
<li>Item 2</li>
</ol>
   
   
   
   
<hr>



<h1>
  Bulleted List - &lt;ul&gt;&lt;li&gt;&lt;/li&gt;&lt;/ul&gt;
</h1>
<h3>
Code
</h3>
<p>
  <pre>
  <code contenteditable spellcheck="false">
    <b>&lt;ul&gt;</b> 
    <b>&lt;li&gt;</b> Item 1<b>&lt;/li&gt;</b> 
    <b>&lt;li&gt;</b> Item 2<b>&lt;/li&gt;</b> 
    <b>&lt;/ul&gt; </b>  
  </code>
  </pre>
</p>

<h3>
Renders
</h3>
<ul>
<li>Item 1</li>
<li>Item 2</li>
</ul>

CSS

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap');
body{font-family: 'Roboto', sans-serif;}
h1 {
    font-size: 26px;
    color: #666;
    line-height: 1.5em;background-color: rgba(172, 197, 237, .25);
    font-family: 'Roboto', sans-serif;
}