web-dev-qa-db-fra.com

Dans Markdown, quel est le meilleur moyen de créer un lien vers un fragment de page, c'est-à-dire #some_id?

J'essaie de comprendre comment faire référence à une autre zone d'une page avec Markdown. Je peux le faire fonctionner si j'ajoute un

<div id="mylink" />

et pour le lien faire:

[My link](#mylink)

Mais je suppose qu’il existe un autre moyen de créer un lien dans la page dans Markdown qui n’implique pas la balise div directe.

Des idées?

htmlmarkdown
115
Chris

Voir cette réponse .

En résumé faire une destination avec

<a name="sometext"></a>

inséré n'importe où dans votre balisage (par exemple dans un en-tête:

## heading<a name="headin"></a>

et le lier à l'aide du lien de démarquage:

[This is the link text](#headin)

ou

[some text](#sometext)

N'utilisez pas <div> - cela va gâcher la mise en page de nombreux moteurs de rendu.

(J'ai changé id= à name= au dessus de. Voir cette réponse pour l'explication fastidieuse.)

152
Steve Powell

Je suppose que cela dépend de ce que vous utilisez pour générer du HTML à partir de votre démarque. J'ai remarqué que jekyll (utilisé par défaut par les pages gihub.io) ajoute automatiquement l'attribut id = "" aux en-têtes du code HTML généré.

Par exemple, si vous êtes démarqué,

My header
---------

Le code HTML résultant ressemblera à ceci:

<h2 id="my-header">My header</h2>

Vous pouvez donc y accéder simplement par [My link](#my-header)

20
bodgix

Avec version PHP de Markdown , vous pouvez également lier des en-têtes à des identificateurs de fragment dans la page à l'aide d'une syntaxe semblable à celle décrite ci-dessous, comme indiqué dans la documentation ici

Header 1            {#header1}
========

## Header 2 ##      {#header2}

et alors

[Link back to header 1](#header1)
[Link back to header 2](#header2)

Malheureusement, cette syntaxe n'est actuellement prise en charge que pour les en-têtes, mais au moins elle pourrait être utile pour créer une table des matières.

14
Klokie

L'ancre de destination pour un lien dans une page HTML peut être n'importe quel élément avec un attribut id. Voir Liens sur le site du W3C. Voici une citation de la section pertinente:

Les ancres de destination dans les documents HTML peuvent être spécifiées soit par l'élément A (en le nommant avec l'attribut name), soit en utilisant tout autre élément (en nommant avec l'attribut id).

Markdown traite HTML en tant que HTML (voir Inline HTML ), afin que vous puissiez créer vos identificateurs de fragment à partir de tout élément de votre choix. Si, par exemple, vous souhaitez créer un lien vers un paragraphe, enveloppez-le simplement dans une balise de paragraphe et incluez un identifiant:

<p id="mylink">Lorem ipsum dolor sit amet...</p>

Ensuite, utilisez votre Markdown [My link](#mylink) standard pour créer un lien permettant de fragmenter une ancre. Cela vous aidera à garder votre code HTML propre, car aucun balisage supplémentaire n’est nécessaire.

3
Mike

Quiconque utilise TFS 2015 de Visual Studio Team Foundation ne l’aime vraiment pas <a> ou <div> éléments, au moins dans les en-têtes. Il n'aime pas non plus emoji dans les en-têtes:

### ???? Configuration ????

Lorem ipsum problem fixem.

Obtient traduit en:

<h3 id="-configuration-">???? Configuration ????</h3>
<p>Lorem ipsum problem fixem.</p>

Et les liens doivent donc utiliser id (qui rompt this et d’autres extensions de prévisualisation dans Visual Studio), ou bien supprimer l’emoji:

Here's [how to setup](#-configuration-) //???? Configuration ????
Here's [how to setup](#configuration) //Configuration

Où cette dernière version fonctionne à la fois en ligne dans TFS et dans l'aperçu du démarquage de Visual Studio.

2
Nick