<head>
  <link href='https://fonts.googleapis.com/css?family=Montserrat' rel='stylesheet'>
</head>
<header class="cours">
  <h1>Apprendre les bases du Javascript</h1>
  <h2>Tech update</h2>
</header>
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  font-family: "Montserrat";
  background-color: white;
  text-align: center;
}
h1 {
  font-size: 32px;
}

h2 {
  font-size: 14px;
}

header {
  background-color: #4c35e0;
  color: white;
  padding: 30px;
}

h1,
h2 {
  cursor: pointer;
}

let title = document.querySelector("h1");
let subtitle = document.querySelector("h2");
title.addEventListener("click", function () {
  subtitle.insertAdjacentElement("afterend", title);
  subtitle.addEventListener("click", function () {
    title.insertAdjacentElement("afterend", subtitle);
  });
});

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.