Objectif Frontend. Comment rendre facilement un tableau responsive

Dans ce nouveau tuto de ma collection nommée "Objectif Frontend" dont le but est de vous donner toutes les clés afin de vous aider à devenir un excellent développeur frontend, je vous propose de découvrir comment rendre un tableau totalement responsive.

Le tableau devra rester cohérent pour l'utilisateur. En effet, l'utilisateur devra comprendre facilement et simplement les données issues du tableau. Pour cela, nous afficherons en permanence les entêtes de chaque colonne du tableau.
Pour les grands écrans, l'entête du tableau apparaîtra qu'une seule fois en haut de chaque colonne, comme il est coutume de le faire pour une présentation compréhensible.
Pour les écrans plus petits, l'entête du tableau se retrouvera à côté de chaque cellule et devra être répété pour chaque ligne du tableau, ainsi l'utilisateur comprendra instantanément à quel entête correspond une donnée.

Pour aller plus loin dans les connaissances utilisées dans ce tutoriel, je vous propose un tuto dédié aux sélecteurs CSS, ainsi qu'un tuto dédié aux datasets.