title: What is a vertical bar in jade?
body: <p>To convert HTML to jade is use this <a href="http://html2jade.aaron-powell.com/" rel="noreferrer">jade converter</a>.</p>
  
  <p>When I enter the following HTML,</p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html class="no-js"&gt;
    &lt;head&gt;
      &lt;meta charset="utf-8"&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;div class="container"&gt;
        &lt;div class="header"&gt;
          &lt;ul class="nav nav-pills pull-right"&gt;
            &lt;li class="active"&gt;&lt;a href="#"&gt;Home&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#"&gt;About&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#"&gt;Contact&lt;/a&gt;&lt;/li&gt;
          &lt;/ul&gt;
        &lt;/div&gt;
      &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>the output is as follows:</p>
  
  <pre><code>doctype html.no-js
  head
      meta(charset='utf-8')
    |   
    body
      .container
        .header
          ul.nav.nav-pills.pull-right
            li.active
              a(href='#') Home
            |           
            li
              a(href='#') About
            |           
            li
              a(href='#') Contact
  </code></pre>
  
  <p>What is the purpose of the vertical bars (<code>|</code>) ?</p>