@ou-imdt/css/docs/native/h.md

The IMDT CSS library styles native elements with light, extendable CSS. It is developed for Interactive Media Developers at the Open University.

# Headings

Headings styles are listed below; styles of h4, h5 and h6 are the same as they are less likely to be used than the preceding levels.

> The poppins font is not to be used, as requested by the UX team.

There are also visual-only classes for all h tags, so you can make a span 'look' like a h1 by using
    the .h1 class.


 ## Example

<div class="card">
  <h1>Heading 1</h1>
  <h2>Heading 2</h2>
  <h3>Heading 3</h3>
  <h4>Heading 4</h4>
  <h5>Heading 5</h5>
  <h6>Heading 6</h6>
  <span class="h2">I am a span that looks like a h2</span>

  There are a few specific styles for links nested in headings too:

  <h2><a href="#">I am a Link Heading</a></h2>
</div>




 <details class="compact">
  <summary>HTML</summary>

  ```html
  <h1>Heading 1</h1>
  <h2>Heading 2</h2>
  <h3>Heading 3</h3>
  <h4>Heading 4</h4>
  <h5>Heading 5</h5>
  <h6>Heading 6</h6>

  <span class="h2">I am a span that looks like a h2</span>

  There are a few specific styles for links nested in headings too:

  <h2><a href="#">I am a Link Heading</a></h2>

  <span class="h2"><a href="#">I look link a Link Heading</a></span>
  ```

 </details>