# Footer

Le pied de page : le logo avec les années, celui qui a fait le site, et les liens qui s'appliquent à tout le site.

## Playground

```html
<footer class="feitio-footer"><div class="inner"><span class="who"><strong>Feitio</strong><span>© <span data-since="2026">2026</span></span></span><ul><li><a href="#playground">Changements</a></li><li><a href="#playground">Licence MIT</a></li><li><a href="#playground">GitHub</a></li></ul></div></footer>
```

## Quand l'utiliser

-   À la fin de chaque page d'un site de documentation ou institutionnel.

## Quand ne pas l'utiliser

-   **Sur un écran de travail :** ce qui va dans le pied de page ira dans le pied de page du Drawer.
-   **En tant que deuxième menu**, répété sur chaque page.

## Exemples

### Pied de page

La marque et les années à gauche ; les liens à droite. Sur mobile, l'un sous l'autre.

Afficher le code

```html
<footer class="feitio-footer">
  <div class="inner">
    <span class="who">…<strong>Feitio</strong> © <span data-since="2026">2026</span></span>
    <ul><li><a href="/mudancas">Mudanças</a></li>…</ul>
  </div>
</footer>
```

## Les années

L'année provient de l'attribut `data-since` : alors qu'il s'agit de la même année, elle affiche seulement cela ("2026") ; lorsque l'année change, elle affiche la plage ("2026–2027"), toute seule, sans que personne ne la modifie.

## Anatomie

1.  **Qui :** la marque, le nom et les années.
2.  **Liens :** quelques-uns, ceux qui s'appliquent à tout le site.

## Accessibilité

-   C'est un `<footer>` : les lecteurs d'écran annoncent la région.

## Attributs

Attribut

Valeurs

Pour quoi

`class="feitio-footer"`

sur le `<footer>`

Le pied de page, avec la ligne fine en haut.

`data-since`

la première année

Affiche l'année ou la plage une fois que l'année tourne.
