HiVolda Styleguide

Header 

<!-- H 1 -->
<h1 class="">This is a header h1</h1>


<!-- H 2 -->
<h2 class="">This is a header h2</h2>


<!-- H 3 -->
<h3 class="">This is a header h3</h3>


<!-- H 4 -->
<h4 class="">This is a header h4</h4>


<!-- H 5 -->
<h5 class="">This is a header h5</h5>


<!-- H 6 -->
<h6 class="">This is a header h6</h6>


<{{ element }} {{ attr }} class="{{ class }}">{{ text }}</{{ element }}>
 
/* H 1 */
{
  "element": "h1",
  "text": "This is a header h1"
}


/* H 2 */
{
  "element": "h2",
  "text": "This is a header h2"
}


/* H 3 */
{
  "element": "h3",
  "text": "This is a header h3"
}


/* H 4 */
{
  "element": "h4",
  "text": "This is a header h4"
}


/* H 5 */
{
  "element": "h5",
  "text": "This is a header h5"
}


/* H 6 */
{
  "element": "h6",
  "text": "This is a header h6"
}

In additon to default styling on <h1> to <h6>, classes are available to inherit visual style.

The classes .h1 to .h6 can be applied to any header element.