C'est la fin du projet CSSActif, vous trouverez les explications ici : Fin de CSSActif, ouverture du forum. Le forum reste cependant ouvert à tous et ses ressources sont entièrement disponibles. Merci à tous !
Derniers sujets
» Vos partenaires dans le footer
Sam 10 Nov 2018, 09:39 par FredR

» Mettre votre © Copyright dans le footer de votre forum
Sam 10 Nov 2018, 09:25 par FredR

» Effet pour vos sous-forums
Sam 10 Nov 2018, 06:13 par FredR

» Pour faire des beaux titres de sous-forums
Sam 10 Nov 2018, 05:55 par FredR

» Bouton ''Sélectionner le contenu'', pour les codes
Sam 10 Nov 2018, 05:41 par FredR

» Modifier l'apparence du titre des topics
Sam 10 Nov 2018, 05:28 par FredR

» Début d'un sujet/Fond pour sujet important
Sam 10 Nov 2018, 02:45 par FredR

» Previsualiser le premier message d'un sujet
Ven 09 Nov 2018, 12:49 par FredR


Partagez | 
 

Créer une ancre

Voir le sujet précédent Voir le sujet suivant Aller en bas 
Voir le profil de l'utilisateur http://haras-du-clos.forumactif.com/
{ Membre }
{ Membre }

Féminin Messages : 78



Créer une ancre


Informations générales

Description :
Une ancre est un lien qui, contrairement aux liens ordinaires, vous redirige vers un point précis de la page cible. Voyez-vous, sur ForumActif il existe déjà les ancres Top et Bottom créées automatiquement, mais vous pouvez aussi en créer vous même !

Démo :
Cliquez ici pour vous rendre à la fin du tutoriel !

Testé sur :
Firefox, Chrome, Safari, Opera, Internet Explorer

Crédits :
Proposé par Crash le 21/07/2010 | Validé par Hαrιcoow

Mise(s) à jour :
Mise à jour le 28/07/2012 par Espeon

Le tutoriel


A quoi sert une ancre ?


Par exemple, lors d'une présentation de personnages, vous pouvez faire une liste en début de page et, sur chaque nom, mettre un lien vers l'endroit exact de la page où se trouve la description de chacun. Vous me suivez ?

C'est souvent très utile pour réaliser un sommaire, afin de se rendre directement à un chapitre précis, sur votre forum ou même un site web !

Comment créer une ancre ?


C'est très simple. Dans votre sujet, vous allez placer, là où vous voulez faire suivre votre lien, ceci, c'est à dire, l'ancre :
Code:
<a name="titre">Ancre dans ma page</a>
Ici, le nom (spécifié par la valeur de l'attribut name) de l'ancre est titre, mais il va de soi que vous pouvez mettre ce que bon vous semble Wink

Il n'est pas impératif de placer la balise <a> autour d'un texte, vous pouvez parfaitement placer simplement <a name="titre"></a> dans votre page.

Ensuite, pour diriger un lien vers l'ancre :
Code:
<a href="#titre">Votre lien</a>
C'est très simple, il suffit de mettre le nom de votre ancre après le fameux symbole # !

Ceux qui ont l'oeil reconnaîtront le symbole de l'identifiant, propre à l'attribut id. Il est en effet possible de pointer vers un élément (une div par exemple) ayant un identifiant spécifié. C'est à dire que le lien précédent marcherait tout à fait si vous pointiez vers une div portant cet identifiant (Ce qui vous évite de devoir rajouter l'ancre <a name="titre"></a>) :
Code:
<div id="titre">Contenu de votre div</div>
Gare aux erreurs ! L'identifiant de l'ancre porte bien son nom : il identifie !

Il se doit donc de respecter certaines règles de nommage, à savoir pas d'accents, pas d'espaces et surtout, l'identifiant doit être unique !


URL externes


Enfin, si vous souhaitez faire une ancre qui mène à un endroit précis sur une autre page, il suffit de remplacer l'url externe par la page vers laquelle on se dirige et d'appliquer le même principe :
Code:
<a href="url_externe#titre">Blablabla</a>

Un exemple ? C'est exactement comme ça que fonctionnent les liens sur l'image Voir le dernier message, qui permettent de 'voir le dernier message de ce sujet' Wink

Vous avez tout compris ? Essayez donc à votre tour !


Et vous voici à la fin du tutoriel ! Habile non ?
Cliquez ici si vous souhaitez revenir au début du tutoriel, le tour est joué !

MessageSujet: Créer une ancre    Mer 21 Juil 2010, 09:23
Revenir en haut Aller en bas
Voir le profil de l'utilisateur http://www.i-love-harvard.com/
avatar
Blanche-Neige
Blanche-Neige

Féminin Messages : 5576



FAQ


Q
//

R
//



Pour toute question sur ce tutoriel, merci de poster une demande d'aide ici :
http://www.css-actif.com/f17-aide-css-xhtml


Le forum n'est désormais plus géré par le staff, laissé seulement ouvert pour que les ressources et l'entraide restent accessibles. Vous pouvez néanmoins m'envoyer un MP pour supprimer un message, signaler un plagiat ou autre, je m'en occuperai à ma prochaine connexion.
MessageSujet: Re: Créer une ancre    Mer 03 Aoû 2011, 09:12
Revenir en haut Aller en bas
Voir le profil de l'utilisateur
avatar
Administrateur
Administrateur

Masculin Messages : 1819



31-07-12 : Tutoriel revu et mis à jour


MessageSujet: Re: Créer une ancre    Mar 31 Juil 2012, 06:47
Revenir en haut Aller en bas
Contenu sponsorisé




MessageSujet: Re: Créer une ancre    
Revenir en haut Aller en bas
 

Créer une ancre

Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
CSSActif :: Tutoriels de CSSActif :: ForumActif Pas à pas :: Les Messages-

Partenaires Or


← Page précédente   ↑ Aller en haut Copyright © CSSActif 2009 - 2013 Tous droits réservés
Créer un forum | © phpBB | Forum gratuit d'entraide | Contact | Signaler un abus | Forum gratuit