4 #elements Elements

These are site elements

4.1 #elements.forms Forms

TODO: More variety

Example
Legend Input: Select:
<legend>Legend</legend>
Input: <input/>
<label>Label</label>
Select:
<select>
   <option>Option 1</option>
   <option>Option 2</option>
</select>
<textarea>Textarea</textarea>

4.3 #elements.lists Lists

Default list markup

Example
  • Default list
  • List
    • Nested List
  • Unstyled list
  • Bulleted list
  1. Decimal list
  • List
    • Nested List
<ul>
 <li>Default list</li>
</ul>
<ul>
 <li>List</li>
 <ul>
   <li>Nested List</li>
 </ul>
</ul>
<ul class="list-unstyled">
 <li>Unstyled list</li>
</ul>
<ul class="list-bullet">
	<li>Bulleted list</li>
</ul>
<ol class="list-decimal">
	<li>Decimal list</li>
</ol>
<ul class="list-nested">
 <li>List</li>
 <ul>
   <li>Nested List</li>
 </ul>
</ul>
Example

Introduction (h1)

Heading 2 (h2)

Heading 3 (h3)

Heading 4 (h4)

Heading 5 (h5)

Paragraph – Extra-Large

Paragraph – Large

Paragraph – Medium

Paragraph – Small

Paragraph – Default (Large)

<h1>Introduction (h1)</h1>
<h2>Heading 2 (h2)</h2>
<h3>Heading 3 (h3)</h3>
<h4>Heading 4 (h4)</h4>
<h5>Heading 5 (h5)</h5>
<p class="para-xl">Paragraph – Extra-Large</p>
<p class="para-lg">Paragraph – Large</p>
<p class="para-md">Paragraph – Medium</p>
<p class="para-sm">Paragraph – Small</p>
<p>Paragraph – Default (Large)</p>