WEB TUTO
  • Web Tuto
  • News
  • Apprendre a Creer un Site Web avec HTML et CSS
  • Hebergement
  • Nom de Domaine
  • Hebergeur
  • Tutoriel de Referencement et Optimisation SEO
  • 16 Verites Swagg Man
  • Photos Emma Watson
  • Emma Watson Scandale
  • Swagg Man et Emma Watson
  • Swagg Man Biographie

Le Cas des Ancres

Le Cas des Ancres



Bon. On a vu comment créer des liens complets et des liens partiels, mais que nous reste-t-il à apprendre concernant l'utilisation des liens ?

Et bien les ancres !

Tout d'abord il faut bien vous imaginez que certaines pages HTML peuvent être très longue, prenez un article Wikipédia par exemple. Pour faciliter la navigateur dans ces longues pages HTML on a créé ce que l'on appelle communément des ancres.

Il s'agit de points de repères dans la page. Cela peut être très utile si vous voulez diviser votre page HTML en plusieurs parties, et donner la possibilité au visiteur d'aller directement à la partie que l'intéresse.

Créer une Ancre

Avant d'apprendre à créer des liens vers une ancre, il faut d'abord savoir créer l'ancre en elle-même.

Une ancre peut se créer à partir de n'importe quelle balise HTML. Prenons pour cette exemple un titre H1.

Pour créer l'ancre, il suffit d'y ajouter un attribut ID comme ceci :

<h1 id="webtuto">mon titre</h1>

Ici le nom de l'ancre, ou repère de l'ancre, est "webtuto".

Lien vers une Ancre

Pour faire un lien vers une ancre c'est facile. Vous prenez le nom de l'encre, vus ajoutez un dièse (#) devant et vous faites un lien vers tout ça.

Exemple : <a href="#webtuto">lien vers ancre</a>

Ce lien vous dirige vers l'ancre "webtuto", celle que nous avons créée plus haut.

Si vous voulez voir cet exemple en live, il vous faut d'abord créer le lien (en haut de la page de préférence), ensuite ajouter plein de texte histoire de prendre de la place, et finalement mettre l'ancre que vous voulez.

   Est si je veux faire un lien vers l'ancre d'un autre page que celle sur laquelle je suis actuellement ?

C'est très simple.

Vous ajoutez d'abord la page du lien, puis le dièse, puis l'ancre.

Par exemple, si je veux faire un lien vers l'ancre "webtuto" de la page "page.html" je fais comme ceci :

<a href="page.html#webtuto">lien vers ancre</a>

Comme vous le voyez, ce n'est pas sorcier.

Voici les liens de navigation rapide du chapitre Créer des liens :
1. Lien complet
2. Lien partiel
3. Le cas des ancres
4. Attributs spéciaux de liens


N'hésitez pas à partager ce tuto !



Commentaires

Powered by Create your own unique website with customizable templates.