- Passer au contenu principal
- Passer à « À propos de ce site »

# Notes de bas de page

- Documentation
- Questions ou commentaires?

## But

Le plugiciel Notes de bas de page vise à mettre en place une méthode cohérente et facile d’accès pour répertorier les notes de bas de page dans l’ensemble des sites Web du gouvernement canadien. L’idée force qui sous-tend cette solution consiste à classer les notes de bas de page dans une liste de définitions à l’intérieur d’une section spécifique. Un exemple de ceci peut être trouvé dans la section Notes de bas de page. Des styles CSS servent à disposer les notes de bas de page et à dissimuler les aides à la navigationNote de bas de page 1.

## Avantages

- Conformes à WCAG 2.0 AANote de bas de page 2
- Approche d'amélioration progressive
- Soutien pour Firefox, Opera, Safari, Chrome et IE 7+Note de bas de page 2
- Soutien pour l'anglais et le français
- Mise en page et conception configurableNote de bas de page 2 Note de bas de page 3

## Utilisation recommandée

- Exécuter les notes de bas de page dans les pages WebNote de bas de page *

## Notes de bas de page

Note de bas de page 1

  Exemple de note de bas de page standard.

  Retour à la référence de la note de bas de page 1

Note de bas de page 2

  Exemple de note de bas de page qui comporte de nombreux liens.

  Retour à la première référence de la note de bas de page 2

Note de bas de page 3

  Exemple de note de bas de page qui compte plusieurs paragraphes (premier paragraphe).

  Exemple de note de bas de page qui compte plusieurs paragraphes (deuxième paragraphe).

  Exemple de note de bas de page qui compte plusieurs paragraphes (troisième paragraphe).

  Retour à la référence de la note de bas de page 3

Note de bas de page *

  Exemple de note de bas de page standard, représentée par un symbole.

  Retour à la référence de la note de bas de page *

## Code

    <section>
    	<h2>But</h2>
    	<p>Le plugiciel Notes de bas de page vise à mettre en place une méthode cohérente et facile d’accès pour répertorier les notes de bas de page dans l’ensemble des sites Web du gouvernement canadien. L’idée force qui sous-tend cette solution consiste à classer les notes de bas de page dans une liste de définitions à l’intérieur d’une section spécifique. Un exemple de ceci peut être trouvé dans la section <a href="#fn">Notes de bas de page</a>. Des styles CSS servent à disposer les notes de bas de page et à dissimuler les aides à la navigation<sup id="fn1-rf"><a class="fn-lnk" href="#fn1"><span class="wb-inv">Note de bas de page </span>1</a></sup>.</p>
    </section>

    <section>
    	<h2>Avantages</h2>
    	<ul>
    		<li>Conformes à WCAG 2.0 AA<sup id="fn2-1-rf"><a class="fn-lnk" href="#fn2"><span class="wb-inv">Note de bas de page </span>2</a></sup></li>
    		<li>Approche d'amélioration progressive</li>
    		<li>Soutien pour Firefox, Opera, Safari, Chrome et IE 7+<sup id="fn2-2-rf"><a class="fn-lnk" href="#fn2"><span class="wb-inv">Note de bas de page </span>2</a></sup></li>
    		<li>Soutien pour l'anglais et le français</li>
    		<li>Mise en page et conception configurable<sup id="fn2-3-rf"><a class="fn-lnk" href="#fn2"><span class="wb-inv">Note de bas de page </span>2</a></sup> <sup id="fn3-rf"><a class="fn-lnk" href="#fn3"><span class="wb-inv">Note de bas de page </span>3</a></sup></li>
    	</ul>
    </section>

    <section>
    	<h2>Utilisation recommandée</h2>
    		<ul>
    			<li>Exécuter les notes de bas de page dans les pages Web<sup id="fn*-rf"><a class="fn-lnk" href="#fn*"><span class="wb-inv">Note de bas de page </span>*</a></sup></li>
    		</ul>
    </section>

    <aside class="wb-fnote" role="note">
    	<h2 id="fn">Notes de bas de page</h2>
    	<dl>
    		<dt>Note de bas de page 1</dt>
    		<dd id="fn1">
    			<p>Exemple de note de bas de page standard.</p>
    			<p class="fn-rtn"><a href="#fn1-rf"><span class="wb-inv">Retour à la référence de la note de bas de page </span>1</a></p>
    		</dd>
    		<dt>Note de bas de page 2</dt>
    		<dd id="fn2">
    			<p>Exemple de note de bas de page qui comporte de nombreux liens.</p>
    			<p class="fn-rtn"><a href="#fn2-1-rf"><span class="wb-inv">Retour à la <span>première</span> référence de la note de bas de page </span>2</a></p>
    		</dd>
    		<dt>Note de bas de page 3</dt>
    		<dd id="fn3">
    			<p>Exemple de note de bas de page qui compte plusieurs paragraphes (premier paragraphe).</p>
    			<p>Exemple de note de bas de page qui compte plusieurs paragraphes (deuxième paragraphe).</p>
    			<p>Exemple de note de bas de page qui compte plusieurs paragraphes (troisième paragraphe).</p>
    			<p class="fn-rtn"><a href="#fn3-rf"><span class="wb-inv">Retour à la référence de la note de bas de page </span>3</a></p>
    		</dd>
    		<dt>Note de bas de page *</dt>
    		<dd id="fn*">
    			<p>Exemple de note de bas de page standard, représentée par un symbole.</p>
    			<p class="fn-rtn"><a href="#fn*-rf"><span class="wb-inv">Retour à la référence de la note de bas de page </span>*</a></p>
    		</dd>
    	</dl>
    </aside>

Date de modification :
  2016-06-10