Skip to content

Instantly share code, notes, and snippets.

@TheShinriel
Last active September 25, 2023 15:43
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save TheShinriel/71c190ca7dab443738fced7140ef9cba to your computer and use it in GitHub Desktop.
Save TheShinriel/71c190ca7dab443738fced7140ef9cba to your computer and use it in GitHub Desktop.
Montre les différentes types d'url en html
<!-- URL Absolue -->
<!-- Inclus le protocole (HTTP, HTTPS) et le nom de domaine complet. -->
<a href="https://www.exemple.com/page.html">Lien</a>
<!-- URL Relative -->
<!-- Le chemin est relatif au path courant -->
<!-- Si on est sur l'url https://www.exemple.com/subPath/index.html -->
<!-- On ciblera alors => https://www.exemple.com/subPath/page.html -->
<a href="page.html">Lien</a>
<!-- Chemin Absolu à partir de la Racine du Domaine -->
<!-- On cible à partir de la racine du site => https://www.exemple.com/page.html -->
<a href="/page.html">Lien</a>
<!-- Chemin Relatif au Dossier Courant -->
<!-- Identique à l'url relative, on spécifie un sous path -->
<!-- On ciblera alors => https://www.exemple.com/dossier/page.html -->
<a href="dossier/page.html">Lien</a>
<!-- Ancrage -->
<!-- Cible un lien vers une section spécifique dans
la même page ou dans une autre page. -->
<!-- Dans la même page -->
<a href="#section">Aller à la section</a>
<!-- Dans une autre page -->
<a href="page.html#section">Aller à la section</a>
<!-- La section ciblée est déclarée par : -->
<h2 id="section">Titre de la Section</h2>
<!-- Protocole relatif -->
<!-- Cela permet au navigateur de choisir le protocole (HTTP ou HTTPS)
en fonction de ce qui est utilisé pour la page courante. -->
<!-- Si on est sur une page https on visera alors => https://www.exemple.com/page.html -->
<a href="//www.exemple.com/page.html">Lien</a>
<!-- URLs de Données -->
<!-- Généralement des fichiers images, directement dans l'URL,
mais pouvant être tout type de données -->
<!-- Dans l'exemple les ... sont à remplacer par une string en base 64 -->
<img src="data:image/png;base64,..." />
<!-- URL Javascript -->
<!-- Utilisé pour exécuter du code JavaScript -->
<a href="javascript:alert('Bonjour');">Cliquez-moi</a>
<!-- URL Mailto -->
<!-- Pour ouvrir le client de messagerie par défaut de
l'utilisateur en pré-remplissant l'expéditeur -->
<a href="mailto:exemple@email.com">Envoyer un e-mail</a>
<!-- URL Tel -->
<!-- Pour initier un appel téléphonique sur les appareils qui le supportent -->
<a href="tel:+123456789">Appeler</a>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment