Outils pour utilisateurs
html:liens-images
Différences
Ci-dessous, les différences entre deux révisions de la page.
| Les deux révisions précédentes Révision précédente Prochaine révision | Révision précédente | ||
|
html:liens-images [2017/03/08 19:10] noordo |
html:liens-images [2018/02/02 15:56] (Version actuelle) noordo [Exemples] |
||
|---|---|---|---|
| Ligne 4: | Ligne 4: | ||
| ==== Syntaxes ==== | ==== Syntaxes ==== | ||
| + | |||
| + | Pour insérer un lien : | ||
| + | - on utilise la balise **a** et son attribut **href** ; | ||
| + | - entre la balise ouvrante **<a>** et la balise fermante **</a>**, on indique le texte qui apparaitra dans la page ; | ||
| + | - l'attribut **href** placé dans la balise ouvrante permet de spécifier l'adresse (url) de la page vers laquelle doit se faire le lien. | ||
| <a href="{url}">Texte</a> | <a href="{url}">Texte</a> | ||
| + | |||
| + | La balise **<a>...</a>** possède d'autres attributs que **href**, par exemple l'attribut **target** (dont le rôle est expliqué dans les lignes qui suivent) : | ||
| <a href="{url}" target='_blank'>Texte</a> | <a href="{url}" target='_blank'>Texte</a> | ||
| Ligne 15: | Ligne 22: | ||
| <webcode> | <webcode> | ||
| * Code HTML | * Code HTML | ||
| - | <code HTML> | + | <code html> |
| - | <a href="http://noordover.fr">Lien vers le site noordover.fr</a> | + | <a href="https://noordover.fr">Lien vers le site noordover.fr</a> |
| <br /><br /> | <br /><br /> | ||
| - | <a href="http://noordover.fr" target='_blank'>Lien vers le site noordover.fr</a> dans un nouvel onglet. | + | <a href="https://noordover.fr" target='_blank'>Lien vers le site noordover.fr</a> dans un nouvel onglet. |
| </code> | </code> | ||
| </webcode> | </webcode> | ||
| + | |||
| + | ==== A propos de l'adresse (url) passée à l'attribut href ==== | ||
| + | |||
| + | * **Pour un lien vers un site externe**, l'url débutera par <code>http:// | ||
| + | ou | ||
| + | https://</code> | ||
| + | * **Pour un lien vers un fichier local, l'url sera relative !** Il suffira d'écrire : | ||
| + | * "//exemple.html//" pour faire un lien vers un fichier "//exemple.html//" qui se trouve dans le même dossier ; | ||
| + | * "//doss/exemple.html//" pour faire un lien vers un fichier "//exemple.html//" qui se trouve dans le sous-dossier "//doss//" du dossier courant ; | ||
| + | * "//../doss/exemple.html//" pour faire un lien vers un fichier "//exemple.html//" qui se trouve dans un dossier "//doss//" qui se trouve à côté de celui contenant le fichier courant. | ||
| ===== Images ===== | ===== Images ===== | ||
| Ligne 36: | Ligne 53: | ||
| <webcode height=300> | <webcode height=300> | ||
| * Code HTML | * Code HTML | ||
| - | <code HTML> | + | <code html> |
| <img src="https://noordover.fr/img/lycee_noordover_aerienne1_500x300.jpg" alt="Vue aérienne Noordo" /> | <img src="https://noordover.fr/img/lycee_noordover_aerienne1_500x300.jpg" alt="Vue aérienne Noordo" /> | ||
| </code> | </code> | ||
| Ligne 43: | Ligne 60: | ||
| <webcode height=300> | <webcode height=300> | ||
| * Code HTML | * Code HTML | ||
| - | <code HTML> | + | <code html> |
| <img src="https://noordover.fr/img/lycee_noordover_aerienne1_500x300.jpg" alt="Vue aérienne Noordo" width="300px" /> | <img src="https://noordover.fr/img/lycee_noordover_aerienne1_500x300.jpg" alt="Vue aérienne Noordo" width="300px" /> | ||
| </code> | </code> | ||
| </webcode> | </webcode> | ||
html/liens-images.1488996638.txt.gz · Dernière modification: 2017/03/08 19:10 par noordo
Sauf mention contraire, le contenu de ce wiki est placé sous les termes de la licence suivante : CC Attribution-Share Alike 4.0 International
