[{"data":1,"prerenderedAt":1384},["ShallowReactive",2],{"blog-post:fr:\u002Ffr\u002Fblog\u002Fmarkdown-tableaux-guide-complet":3},{"id":4,"title":5,"author":6,"body":7,"category":1353,"date":1354,"description":1355,"extension":1356,"image":1357,"imageAlt":1358,"meta":1359,"navigation":1360,"path":1361,"seo":1362,"stem":1363,"tags":1364,"translationKey":1365,"__hash__":1366,"html":1367,"bodyMarkdown":1368,"translations":1369,"previous":1376,"next":1381},"blog\u002Ffr\u002Fblog\u002F2.markdown-tableaux-guide-complet.md","Tableau Markdown : Guide complet avec exemples","Antoine Frankart",{"type":8,"value":9,"toc":1329},"minimark",[10,14,17,22,25,67,70,93,96,121,128,132,135,165,168,198,209,212,216,219,269,272,302,309,313,319,322,347,358,362,365,368,373,380,405,408,412,415,440,450,454,457,460,484,491,494,588,591,595,605,608,746,749,753,756,759,795,802,897,900,904,907,931,934,968,972,975,1002,1005,1027,1031,1034,1054,1065,1069,1072,1083,1103,1106,1110,1114,1117,1124,1128,1131,1135,1143,1147,1156,1160,1296,1299,1305,1308,1315,1318,1325],[11,12,13],"p",{},"Les tableaux Markdown semblent intimidants en texte brut. Des barres verticales partout, des tirets qui s'alignent (ou pas), du contenu qui refuse de rester dans sa colonne. Mais la syntaxe est en réalité simple une fois que vous avez compris ses trois parties : l'en-tête, le séparateur et les lignes.",[11,15,16],{},"Voici tout ce que j'ai appris sur les tableaux Markdown, des bases jusqu'aux cas particuliers.",[18,19,21],"h2",{"id":20},"la-syntaxe-de-base","La syntaxe de base",[11,23,24],{},"Un tableau Markdown comporte trois composants : une ligne d'en-tête, une ligne de séparation et une ou plusieurs lignes de données.",[26,27,32],"pre",{"className":28,"code":29,"language":30,"meta":31,"style":31},"language-markdown shiki shiki-themes github-light github-dark","| Nom     | Rôle      | Lieu     |\n| ------- | --------- | -------- |\n| Alice   | Dev       | Paris    |\n| Bob     | Designer  | Lyon     |\n| Charlie | PM        | Remote   |\n","markdown","",[33,34,35,43,49,55,61],"code",{"__ignoreMap":31},[36,37,40],"span",{"class":38,"line":39},"line",1,[36,41,42],{},"| Nom     | Rôle      | Lieu     |\n",[36,44,46],{"class":38,"line":45},2,[36,47,48],{},"| ------- | --------- | -------- |\n",[36,50,52],{"class":38,"line":51},3,[36,53,54],{},"| Alice   | Dev       | Paris    |\n",[36,56,58],{"class":38,"line":57},4,[36,59,60],{},"| Bob     | Designer  | Lyon     |\n",[36,62,64],{"class":38,"line":63},5,[36,65,66],{},"| Charlie | PM        | Remote   |\n",[11,68,69],{},"Les règles :",[71,72,73,81,87,90],"ul",{},[74,75,76,77,80],"li",{},"Utilisez ",[33,78,79],{},"|"," (barre verticale ou pipe) pour séparer les colonnes.",[74,82,76,83,86],{},[33,84,85],{},"---"," (trois tirets ou plus) dans la ligne de séparation pour définir chaque colonne.",[74,88,89],{},"Ajoutez une barre verticale au début et à la fin de chaque ligne. C'est techniquement facultatif dans certains outils de rendu, mais faites-le toujours pour des raisons de compatibilité.",[74,91,92],{},"Laissez une ligne vide avant le tableau. Sans cela, certains moteurs de rendu ne l'analyseront pas correctement.",[11,94,95],{},"Les largeurs des cellules n'ont pas besoin de correspondre. Ceci est parfaitement valide :",[26,97,99],{"className":28,"code":98,"language":30,"meta":31,"style":31},"| Nom | Rôle |\n| --- | --- |\n| Alice | Développeuse |\n| Bob | Designer |\n",[33,100,101,106,111,116],{"__ignoreMap":31},[36,102,103],{"class":38,"line":39},[36,104,105],{},"| Nom | Rôle |\n",[36,107,108],{"class":38,"line":45},[36,109,110],{},"| --- | --- |\n",[36,112,113],{"class":38,"line":51},[36,114,115],{},"| Alice | Développeuse |\n",[36,117,118],{"class":38,"line":57},[36,119,120],{},"| Bob | Designer |\n",[11,122,123,124,127],{},"Le rendu sera identique, que vous aligniez les barres verticales dans le fichier source ou non. L'alignement dans le fichier brut est purement cosmétique, il aide à la lisibilité lorsque vous ouvrez le fichier ",[33,125,126],{},".md"," dans un éditeur de texte, rien de plus.",[18,129,131],{"id":130},"alignement-des-colonnes","Alignement des colonnes",[11,133,134],{},"Par défaut, le texte est aligné à gauche. Vous pouvez changer cela avec des deux-points dans la ligne de séparation :",[26,136,138],{"className":28,"code":137,"language":30,"meta":31,"style":31},"| Produit         | En stock |  Prix |\n| :-------------- | :------: | ----: |\n| Livre Markdown  |   Oui    | 19.99 |\n| Cheat Sheet     |   Non    |  4.99 |\n| Pack Stickers   |   Oui    |  2.49 |\n",[33,139,140,145,150,155,160],{"__ignoreMap":31},[36,141,142],{"class":38,"line":39},[36,143,144],{},"| Produit         | En stock |  Prix |\n",[36,146,147],{"class":38,"line":45},[36,148,149],{},"| :-------------- | :------: | ----: |\n",[36,151,152],{"class":38,"line":51},[36,153,154],{},"| Livre Markdown  |   Oui    | 19.99 |\n",[36,156,157],{"class":38,"line":57},[36,158,159],{},"| Cheat Sheet     |   Non    |  4.99 |\n",[36,161,162],{"class":38,"line":63},[36,163,164],{},"| Pack Stickers   |   Oui    |  2.49 |\n",[11,166,167],{},"Les deux-points fonctionnent ainsi :",[71,169,170,180,189],{},[74,171,172,175,176,179],{},[33,173,174],{},":---"," ou ",[33,177,178],{},":--"," aligné à gauche (par défaut).",[74,181,182,175,185,188],{},[33,183,184],{},":---:",[33,186,187],{},":-:"," centré.",[74,190,191,175,194,197],{},[33,192,193],{},"---:",[33,195,196],{},"--:"," aligné à droite.",[11,199,200,201,204,205,208],{},"Le nombre de tirets n'a pas d'importance. ",[33,202,203],{},":--:"," fonctionne de la même manière que ",[33,206,207],{},":--------:",". Seule la position des deux-points compte.",[11,210,211],{},"Un modèle courant : alignez à gauche les colonnes de texte, centrez les colonnes de statut et alignez à droite les nombres. Cela rend les tableaux beaucoup plus faciles à lire.",[18,213,215],{"id":214},"formater-le-texte-à-lintérieur-des-cellules","Formater le texte à l'intérieur des cellules",[11,217,218],{},"Vous pouvez utiliser la plupart des formatages Markdown en ligne dans les cellules d'un tableau :",[71,220,221,231,240,248,260],{},[74,222,223,227,228],{},[224,225,226],"strong",{},"Gras"," : ",[33,229,230],{},"**texte**",[74,232,233,227,237],{},[234,235,236],"em",{},"Italique",[33,238,239],{},"*texte*",[74,241,242,227,245],{},[33,243,244],{},"Code",[33,246,247],{},"`code`",[74,249,250,227,257],{},[251,252,256],"a",{"href":253,"rel":254},"https:\u002F\u002Fexample.com",[255],"nofollow","Liens",[33,258,259],{},"[texte](url)",[74,261,262,227,266],{},[263,264,265],"del",{},"Barré",[33,267,268],{},"~~texte~~",[11,270,271],{},"Exemple :",[26,273,275],{"className":28,"code":274,"language":30,"meta":31,"style":31},"| Fonctionnalité   | Statut        | Notes                      |\n| ---------------- | ------------- | -------------------------- |\n| **Mode sombre**  | `Terminé`     | Livré dans la v2.1         |\n| *Synchronisation*| `En cours`    | [Voir la PR #42](https:\u002F\u002F…)|\n| ~~Ancienne feat~~| `Supprimée`   | Obsolète dans la v3.0      |\n",[33,276,277,282,287,292,297],{"__ignoreMap":31},[36,278,279],{"class":38,"line":39},[36,280,281],{},"| Fonctionnalité   | Statut        | Notes                      |\n",[36,283,284],{"class":38,"line":45},[36,285,286],{},"| ---------------- | ------------- | -------------------------- |\n",[36,288,289],{"class":38,"line":51},[36,290,291],{},"| **Mode sombre**  | `Terminé`     | Livré dans la v2.1         |\n",[36,293,294],{"class":38,"line":57},[36,295,296],{},"| *Synchronisation*| `En cours`    | [Voir la PR #42](https:\u002F\u002F…)|\n",[36,298,299],{"class":38,"line":63},[36,300,301],{},"| ~~Ancienne feat~~| `Supprimée`   | Obsolète dans la v3.0      |\n",[11,303,304,305,308],{},"&\nCe que vous ne pouvez généralement ",[224,306,307],{},"pas"," utiliser à l'intérieur des cellules de tableau de style GitHub Flavored Markdown (GFM) en tant que syntaxe Markdown : les titres, les citations, les lignes horizontales, les listes ou les blocs de code. Les tableaux analysent le contenu en ligne, pas les éléments de bloc. Les images sont en ligne, donc de nombreux moteurs de rendu les prennent en charge, mais elles peuvent rendre les tableaux plus difficiles à lire.",[18,310,312],{"id":311},"échapper-le-caractère-pipe-barre-verticale","Échapper le caractère pipe (barre verticale)",[11,314,315,316,318],{},"Puisque ",[33,317,79],{}," est le délimiteur de colonne, afficher une vraie barre verticale à l'intérieur d'une cellule nécessite de l'échapper.",[11,320,321],{},"Deux méthodes :",[26,323,325],{"className":28,"code":324,"language":30,"meta":31,"style":31},"| Syntaxe   | Exemple      |\n| --------- | ------------ |\n| Antislash | A \\| B       |\n| Code HTML | A | B   |\n",[33,326,327,332,337,342],{"__ignoreMap":31},[36,328,329],{"class":38,"line":39},[36,330,331],{},"| Syntaxe   | Exemple      |\n",[36,333,334],{"class":38,"line":45},[36,335,336],{},"| --------- | ------------ |\n",[36,338,339],{"class":38,"line":51},[36,340,341],{},"| Antislash | A \\| B       |\n",[36,343,344],{"class":38,"line":57},[36,345,346],{},"| Code HTML | A | B   |\n",[11,348,349,350,353,354,357],{},"La méthode de l'antislash (",[33,351,352],{},"\\|",") fonctionne dans le GitHub Flavored Markdown (GFM) et la plupart des outils de rendu modernes. L'entité HTML (",[33,355,356],{},"|",") est la solution de secours universelle, elle fonctionne partout.",[18,359,361],{"id":360},"contenu-multiligne-dans-les-cellules","Contenu multiligne dans les cellules",[11,363,364],{},"Les tableaux GitHub Flavored Markdown (GFM) ne prennent pas nativement en charge les blocs Markdown multilignes au sein d'une seule cellule. En pratique, il vaut mieux traiter chaque cellule comme une ligne unique de contenu en ligne.",[11,366,367],{},"Mais en réalité, on a souvent besoin de plus de quelques mots dans une cellule. Voici les solutions de contournement :",[369,370,372],"h3",{"id":371},"sauts-de-ligne-html","Sauts de ligne HTML",[11,374,375,376,379],{},"La balise ",[33,377,378],{},"\u003Cbr>"," fonctionne dans la plupart des moteurs de rendu :",[26,381,383],{"className":28,"code":382,"language":30,"meta":31,"style":31},"| Étape | Description                                  |\n| ----- | -------------------------------------------- |\n| 1     | Cloner le dépôt\u003Cbr>Lancer `npm install`      |\n| 2     | Créer un fichier `.env`\u003Cbr>Ajouter la clé API|\n",[33,384,385,390,395,400],{"__ignoreMap":31},[36,386,387],{"class":38,"line":39},[36,388,389],{},"| Étape | Description                                  |\n",[36,391,392],{"class":38,"line":45},[36,393,394],{},"| ----- | -------------------------------------------- |\n",[36,396,397],{"class":38,"line":51},[36,398,399],{},"| 1     | Cloner le dépôt\u003Cbr>Lancer `npm install`      |\n",[36,401,402],{"class":38,"line":57},[36,403,404],{},"| 2     | Créer un fichier `.env`\u003Cbr>Ajouter la clé API|\n",[11,406,407],{},"C'est la solution de contournement la plus courante. Elle fonctionne sur GitHub, Obsidian, GitLab, et de nombreux générateurs de sites statiques qui autorisent le HTML en ligne, mais il vaut toujours mieux la tester dans votre moteur de rendu cible.",[369,409,411],{"id":410},"listes-html-dans-les-cellules","Listes HTML dans les cellules",[11,413,414],{},"Si vous avez besoin de vraies puces à l'intérieur d'une cellule, utilisez le HTML :",[26,416,418],{"className":28,"code":417,"language":30,"meta":31,"style":31},"| Module | Inclus                                                  |\n| ------ | ------------------------------------------------------- |\n| Base   | \u003Cul>\u003Cli>Analyseur\u003C\u002Fli>\u003Cli>Moteur de rendu\u003C\u002Fli>\u003C\u002Ful>     |\n| Extras | \u003Cul>\u003Cli>Coloration syntaxique\u003C\u002Fli>\u003Cli>Tableaux\u003C\u002Fli>\u003C\u002Ful>|\n",[33,419,420,425,430,435],{"__ignoreMap":31},[36,421,422],{"class":38,"line":39},[36,423,424],{},"| Module | Inclus                                                  |\n",[36,426,427],{"class":38,"line":45},[36,428,429],{},"| ------ | ------------------------------------------------------- |\n",[36,431,432],{"class":38,"line":51},[36,433,434],{},"| Base   | \u003Cul>\u003Cli>Analyseur\u003C\u002Fli>\u003Cli>Moteur de rendu\u003C\u002Fli>\u003C\u002Ful>     |\n",[36,436,437],{"class":38,"line":57},[36,438,439],{},"| Extras | \u003Cul>\u003Cli>Coloration syntaxique\u003C\u002Fli>\u003Cli>Tableaux\u003C\u002Fli>\u003C\u002Ful>|\n",[11,441,442,443,446,447,449],{},"Tous les moteurs de rendu ne le prennent pas en charge. Parce que les balises de liste comme ",[33,444,445],{},"\u003Cul>"," sont du HTML de niveau bloc, la compatibilité dans les cellules de tableau varie davantage qu'avec ",[33,448,378],{},". Certains moteurs de rendu les gèrent, d'autres les suppriment, et d'autres encore les affichent de manière incohérente. Testez avant de vous engager dans cette approche.",[18,451,453],{"id":452},"tableaux-sans-en-tête","Tableaux sans en-tête",[11,455,456],{},"Dans les tableaux de style GitHub Flavored Markdown (GFM), une ligne d'en-tête est obligatoire. Il n'y a pas moyen de faire autrement avec cette syntaxe.",[11,458,459],{},"Si vous ne voulez pas d'en-tête visible, la meilleure solution de contournement consiste à utiliser des cellules d'en-tête vides :",[26,461,463],{"className":28,"code":462,"language":30,"meta":31,"style":31},"|     |     |\n| --- | --- |\n| A1  | B1  |\n| A2  | B2  |\n",[33,464,465,470,474,479],{"__ignoreMap":31},[36,466,467],{"class":38,"line":39},[36,468,469],{},"|     |     |\n",[36,471,472],{"class":38,"line":45},[36,473,110],{},[36,475,476],{"class":38,"line":51},[36,477,478],{},"| A1  | B1  |\n",[36,480,481],{"class":38,"line":57},[36,482,483],{},"| A2  | B2  |\n",[11,485,486,487,490],{},"La ligne d'en-tête existe toujours dans la sortie HTML (sous la forme ",[33,488,489],{},"\u003Cthead>","), mais visuellement, elle s'affiche comme une ligne vide ou est masquée selon le CSS. Sur GitHub, l'en-tête vide est visible mais discret. Dans Obsidian, cela dépend du thème.",[11,492,493],{},"Une autre approche consiste à utiliser directement le HTML :",[26,495,499],{"className":496,"code":497,"language":498,"meta":31,"style":31},"language-html shiki shiki-themes github-light github-dark","\u003Ctable>\n  \u003Ctr>\u003Ctd>A1\u003C\u002Ftd>\u003Ctd>B1\u003C\u002Ftd>\u003C\u002Ftr>\n  \u003Ctr>\u003Ctd>A2\u003C\u002Ftd>\u003Ctd>B2\u003C\u002Ftd>\u003C\u002Ftr>\n\u003C\u002Ftable>\n","html",[33,500,501,514,549,579],{"__ignoreMap":31},[36,502,503,507,511],{"class":38,"line":39},[36,504,506],{"class":505},"sVt8B","\u003C",[36,508,510],{"class":509},"s9eBZ","table",[36,512,513],{"class":505},">\n",[36,515,516,519,522,525,528,531,533,535,537,540,542,545,547],{"class":38,"line":45},[36,517,518],{"class":505},"  \u003C",[36,520,521],{"class":509},"tr",[36,523,524],{"class":505},">\u003C",[36,526,527],{"class":509},"td",[36,529,530],{"class":505},">A1\u003C\u002F",[36,532,527],{"class":509},[36,534,524],{"class":505},[36,536,527],{"class":509},[36,538,539],{"class":505},">B1\u003C\u002F",[36,541,527],{"class":509},[36,543,544],{"class":505},">\u003C\u002F",[36,546,521],{"class":509},[36,548,513],{"class":505},[36,550,551,553,555,557,559,562,564,566,568,571,573,575,577],{"class":38,"line":51},[36,552,518],{"class":505},[36,554,521],{"class":509},[36,556,524],{"class":505},[36,558,527],{"class":509},[36,560,561],{"class":505},">A2\u003C\u002F",[36,563,527],{"class":509},[36,565,524],{"class":505},[36,567,527],{"class":509},[36,569,570],{"class":505},">B2\u003C\u002F",[36,572,527],{"class":509},[36,574,544],{"class":505},[36,576,521],{"class":509},[36,578,513],{"class":505},[36,580,581,584,586],{"class":38,"line":57},[36,582,583],{"class":505},"\u003C\u002F",[36,585,510],{"class":509},[36,587,513],{"class":505},[11,589,590],{},"Cela ignore complètement l'en-tête, mais vous perdez la simplicité de la syntaxe Markdown.",[18,592,594],{"id":593},"peut-on-fusionner-des-cellules","Peut-on fusionner des cellules ?",[11,596,597,598,175,601,604],{},"Non. Markdown n'a pas de syntaxe pour ",[33,599,600],{},"colspan",[33,602,603],{},"rowspan",".",[11,606,607],{},"Si vous avez vraiment besoin de cellules fusionnées, votre seule option est d'écrire le tableau en HTML :",[26,609,611],{"className":496,"code":610,"language":498,"meta":31,"style":31},"\u003Ctable>\n  \u003Ctr>\n    \u003Cth colspan=\"2\">Nom Complet\u003C\u002Fth>\n    \u003Cth>Rôle\u003C\u002Fth>\n  \u003C\u002Ftr>\n  \u003Ctr>\n    \u003Ctd>Alice\u003C\u002Ftd>\n    \u003Ctd>Martin\u003C\u002Ftd>\n    \u003Ctd>Dev\u003C\u002Ftd>\n  \u003C\u002Ftr>\n\u003C\u002Ftable>\n",[33,612,613,621,629,655,668,677,686,700,714,728,737],{"__ignoreMap":31},[36,614,615,617,619],{"class":38,"line":39},[36,616,506],{"class":505},[36,618,510],{"class":509},[36,620,513],{"class":505},[36,622,623,625,627],{"class":38,"line":45},[36,624,518],{"class":505},[36,626,521],{"class":509},[36,628,513],{"class":505},[36,630,631,634,637,641,644,648,651,653],{"class":38,"line":51},[36,632,633],{"class":505},"    \u003C",[36,635,636],{"class":509},"th",[36,638,640],{"class":639},"sScJk"," colspan",[36,642,643],{"class":505},"=",[36,645,647],{"class":646},"sZZnC","\"2\"",[36,649,650],{"class":505},">Nom Complet\u003C\u002F",[36,652,636],{"class":509},[36,654,513],{"class":505},[36,656,657,659,661,664,666],{"class":38,"line":57},[36,658,633],{"class":505},[36,660,636],{"class":509},[36,662,663],{"class":505},">Rôle\u003C\u002F",[36,665,636],{"class":509},[36,667,513],{"class":505},[36,669,670,673,675],{"class":38,"line":63},[36,671,672],{"class":505},"  \u003C\u002F",[36,674,521],{"class":509},[36,676,513],{"class":505},[36,678,680,682,684],{"class":38,"line":679},6,[36,681,518],{"class":505},[36,683,521],{"class":509},[36,685,513],{"class":505},[36,687,689,691,693,696,698],{"class":38,"line":688},7,[36,690,633],{"class":505},[36,692,527],{"class":509},[36,694,695],{"class":505},">Alice\u003C\u002F",[36,697,527],{"class":509},[36,699,513],{"class":505},[36,701,703,705,707,710,712],{"class":38,"line":702},8,[36,704,633],{"class":505},[36,706,527],{"class":509},[36,708,709],{"class":505},">Martin\u003C\u002F",[36,711,527],{"class":509},[36,713,513],{"class":505},[36,715,717,719,721,724,726],{"class":38,"line":716},9,[36,718,633],{"class":505},[36,720,527],{"class":509},[36,722,723],{"class":505},">Dev\u003C\u002F",[36,725,527],{"class":509},[36,727,513],{"class":505},[36,729,731,733,735],{"class":38,"line":730},10,[36,732,672],{"class":505},[36,734,521],{"class":509},[36,736,513],{"class":505},[36,738,740,742,744],{"class":38,"line":739},11,[36,741,583],{"class":505},[36,743,510],{"class":509},[36,745,513],{"class":505},[11,747,748],{},"Cela fonctionne dans tout moteur de rendu qui accepte les tableaux HTML. Mais cela va à l'encontre du but de Markdown : la lisibilité sous forme de code source. Je réserve les tableaux HTML aux cas où la mise en page nécessite vraiment une fusion, ce qui est plus rare qu'on ne le pense.",[18,750,752],{"id":751},"ajouter-une-légende","Ajouter une légende",[11,754,755],{},"Les tableaux Markdown standard ne prennent pas en charge les légendes. Aucune syntaxe n'existe pour cela.",[11,757,758],{},"Le contournement le plus simple consiste à ajouter une ligne en italique directement sous le tableau :",[26,760,762],{"className":28,"code":761,"language":30,"meta":31,"style":31},"| Trimestre | Revenus |\n| --------- | ------: |\n| Q1        |   120K €|\n| Q2        |   145K €|\n\n*Tableau 1 : Revenus par trimestre, 2025.*\n",[33,763,764,769,774,779,784,790],{"__ignoreMap":31},[36,765,766],{"class":38,"line":39},[36,767,768],{},"| Trimestre | Revenus |\n",[36,770,771],{"class":38,"line":45},[36,772,773],{},"| --------- | ------: |\n",[36,775,776],{"class":38,"line":51},[36,777,778],{},"| Q1        |   120K €|\n",[36,780,781],{"class":38,"line":57},[36,782,783],{},"| Q2        |   145K €|\n",[36,785,786],{"class":38,"line":63},[36,787,789],{"emptyLinePlaceholder":788},true,"\n",[36,791,792],{"class":38,"line":679},[36,793,794],{},"*Tableau 1 : Revenus par trimestre, 2025.*\n",[11,796,797,798,801],{},"Pour la sortie HTML, vous pouvez utiliser la balise ",[33,799,800],{},"\u003Ccaption>"," :",[26,803,805],{"className":496,"code":804,"language":498,"meta":31,"style":31},"\u003Ctable>\n  \u003Ccaption>Revenus par trimestre, 2025\u003C\u002Fcaption>\n  \u003Ctr>\u003Cth>Trimestre\u003C\u002Fth>\u003Cth>Revenus\u003C\u002Fth>\u003C\u002Ftr>\n  \u003Ctr>\u003Ctd>Q1\u003C\u002Ftd>\u003Ctd>120K €\u003C\u002Ftd>\u003C\u002Ftr>\n\u003C\u002Ftable>\n",[33,806,807,815,829,859,889],{"__ignoreMap":31},[36,808,809,811,813],{"class":38,"line":39},[36,810,506],{"class":505},[36,812,510],{"class":509},[36,814,513],{"class":505},[36,816,817,819,822,825,827],{"class":38,"line":45},[36,818,518],{"class":505},[36,820,821],{"class":509},"caption",[36,823,824],{"class":505},">Revenus par trimestre, 2025\u003C\u002F",[36,826,821],{"class":509},[36,828,513],{"class":505},[36,830,831,833,835,837,839,842,844,846,848,851,853,855,857],{"class":38,"line":51},[36,832,518],{"class":505},[36,834,521],{"class":509},[36,836,524],{"class":505},[36,838,636],{"class":509},[36,840,841],{"class":505},">Trimestre\u003C\u002F",[36,843,636],{"class":509},[36,845,524],{"class":505},[36,847,636],{"class":509},[36,849,850],{"class":505},">Revenus\u003C\u002F",[36,852,636],{"class":509},[36,854,544],{"class":505},[36,856,521],{"class":509},[36,858,513],{"class":505},[36,860,861,863,865,867,869,872,874,876,878,881,883,885,887],{"class":38,"line":57},[36,862,518],{"class":505},[36,864,521],{"class":509},[36,866,524],{"class":505},[36,868,527],{"class":509},[36,870,871],{"class":505},">Q1\u003C\u002F",[36,873,527],{"class":509},[36,875,524],{"class":505},[36,877,527],{"class":509},[36,879,880],{"class":505},">120K €\u003C\u002F",[36,882,527],{"class":509},[36,884,544],{"class":505},[36,886,521],{"class":509},[36,888,513],{"class":505},[36,890,891,893,895],{"class":38,"line":63},[36,892,583],{"class":505},[36,894,510],{"class":509},[36,896,513],{"class":505},[11,898,899],{},"Si vous utilisez un générateur de site statique (Nuxt Content, Hugo, Astro, etc.), vérifiez s'il propose une extension ou un shortcode pour les légendes de tableaux. Certains le font.",[18,901,903],{"id":902},"les-tableaux-sur-github","Les tableaux sur GitHub",[11,905,906],{},"GitHub Flavored Markdown (GFM) prend entièrement en charge les tableaux. Quelques spécificités :",[71,908,909,916,919,922,928],{},[74,910,911,912,915],{},"Les barres verticales au début et à la fin des lignes sont ",[224,913,914],{},"facultatives"," en GFM, mais je recommande de toujours les inclure.",[74,917,918],{},"GitHub affiche les tableaux avec un ombrage alterné des lignes (rayures zébrées), ce qui aide à la lisibilité.",[74,920,921],{},"Le formatage en ligne fonctionne : gras, italique, code, liens, barré.",[74,923,924,925,927],{},"Le HTML à l'intérieur des cellules est partiellement pris en charge. ",[33,926,378],{}," fonctionne bien, mais un HTML plus complexe dans les cellules est moins prévisible et certaines balises sont supprimées.",[74,929,930],{},"GitHub renvoie automatiquement à la ligne le contenu long des cellules. Pas de défilement horizontal, le texte passe simplement à la ligne suivante dans la cellule.",[11,932,933],{},"Un modèle courant dans les issues et PR GitHub : utiliser des tableaux pour des comparaisons.",[26,935,937],{"className":28,"code":936,"language":30,"meta":31,"style":31},"## Comparaison\n\n| Approche | Avantages         | Inconvénients           |\n| -------- | ----------------- | ----------------------- |\n| Option A | Simple, rapide    | Fonctionnalités limitées|\n| Option B | Riche en options  | Configuration complexe  |\n",[33,938,939,944,948,953,958,963],{"__ignoreMap":31},[36,940,941],{"class":38,"line":39},[36,942,943],{},"## Comparaison\n",[36,945,946],{"class":38,"line":45},[36,947,789],{"emptyLinePlaceholder":788},[36,949,950],{"class":38,"line":51},[36,951,952],{},"| Approche | Avantages         | Inconvénients           |\n",[36,954,955],{"class":38,"line":57},[36,956,957],{},"| -------- | ----------------- | ----------------------- |\n",[36,959,960],{"class":38,"line":63},[36,961,962],{},"| Option A | Simple, rapide    | Fonctionnalités limitées|\n",[36,964,965],{"class":38,"line":679},[36,966,967],{},"| Option B | Riche en options  | Configuration complexe  |\n",[18,969,971],{"id":970},"les-tableaux-dans-fude","Les tableaux dans Fude",[11,973,974],{},"Dans Fude, les tableaux Markdown standard fonctionnent comme vous vous y attendez. Si votre tableau utilise la syntaxe habituelle de style GitHub, il devrait s'afficher proprement :",[71,976,977,980,991,994,997],{},[74,978,979],{},"une ligne d'en-tête, une ligne de séparation et des lignes de corps",[74,981,982,983,985,986,988,989],{},"l'alignement des colonnes avec ",[33,984,174],{},", ",[33,987,184],{}," et ",[33,990,193],{},[74,992,993],{},"le formatage en ligne dans les cellules comme le gras, l'italique, le code et les liens",[74,995,996],{},"Les liens dans les tableaux se comportent comme les liens ailleurs dans Fude. Les liens web s'ouvrent normalement, et les liens Markdown peuvent toujours pointer vers d'autres notes.",[74,998,999,1001],{},[33,1000,378],{}," à l'intérieur d'une cellule fonctionne, il ajoute un saut de ligne",[11,1003,1004],{},"Si vous vous en tenez à la syntaxe standard des tableaux Markdown, Fude la gérera très bien.",[71,1006,1007,1014],{},[74,1008,1009,1010,1013],{},"Les listes HTML comme ",[33,1011,1012],{},"\u003Cul>\u003Cli>...\u003C\u002Fli>\u003C\u002Ful>"," à l'intérieur des cellules ne sont pas prises en charge",[74,1015,1016,1017,985,1020,985,1022,175,1024,1026],{},"les tableaux HTML bruts avec ",[33,1018,1019],{},"\u003Ctable>",[33,1021,800],{},[33,1023,600],{},[33,1025,603],{}," non plus",[18,1028,1030],{"id":1029},"les-tableaux-dans-obsidian","Les tableaux dans Obsidian",[11,1032,1033],{},"Obsidian prend en charge la syntaxe standard des tableaux Markdown. En pratique :",[71,1035,1036,1039,1042,1049],{},[74,1037,1038],{},"Le mode Aperçu en direct (Live Preview) affiche les tableaux en temps réel pendant que vous tapez.",[74,1040,1041],{},"Obsidian dispose d'un éditeur de tableau intégré (clic droit sur un tableau) qui vous permet d'ajouter\u002Fsupprimer des lignes et des colonnes sans toucher à la syntaxe brute.",[74,1043,1044,1045,1048],{},"L'alignement avec ",[33,1046,1047],{},":"," fonctionne comme prévu.",[74,1050,1051,1053],{},[33,1052,378],{}," dans les cellules fonctionne en mode lecture et en mode aperçu en direct.",[11,1055,1056,1057,1060,1061,1064],{},"Une chose à surveiller : si votre tableau se trouve dans un bloc d'appel (callout) (",[33,1058,1059],{},"> [!note]","), chaque ligne doit être préfixée par ",[33,1062,1063],{},">",". Cela devient fastidieux pour les grands tableaux.",[18,1066,1068],{"id":1067},"quand-un-tableau-nest-pas-le-bon-outil","Quand un tableau n'est pas le bon outil",[11,1070,1071],{},"Les tableaux Markdown fonctionnent bien pour les données structurées sous forme tabulaire avec un nombre constant de colonnes. Ils ne fonctionnent pas bien lorsque :",[71,1073,1074,1077,1080],{},[74,1075,1076],{},"Les cellules contiennent des paragraphes de texte. Le Markdown brut devient illisible et le rendu a l'air à l'étroit.",[74,1078,1079],{},"Vous avez besoin de cellules fusionnées, de tableaux imbriqués ou de mises en page complexes. Utilisez plutôt le HTML.",[74,1081,1082],{},"Les données sont une simple liste de paires clé-valeur. Une liste de définitions ou même du texte en gras est plus simple :",[26,1084,1086],{"className":28,"code":1085,"language":30,"meta":31,"style":31},"**Nom :** Alice\n**Rôle :** Développeuse\n**Lieu :** Paris\n",[33,1087,1088,1093,1098],{"__ignoreMap":31},[36,1089,1090],{"class":38,"line":39},[36,1091,1092],{},"**Nom :** Alice\n",[36,1094,1095],{"class":38,"line":45},[36,1096,1097],{},"**Rôle :** Développeuse\n",[36,1099,1100],{"class":38,"line":51},[36,1101,1102],{},"**Lieu :** Paris\n",[11,1104,1105],{},"C'est plus facile à lire (et à écrire) qu'un tableau à deux colonnes pour la même information.",[18,1107,1109],{"id":1108},"débogage-des-problèmes-courants","Débogage des problèmes courants",[369,1111,1113],{"id":1112},"mon-tableau-ne-saffiche-pas","\"Mon tableau ne s'affiche pas\"",[11,1115,1116],{},"La cause la plus fréquente : aucune ligne vide avant le tableau. Ajoutez-en une.",[11,1118,1119,1120,1123],{},"Deuxième cause la plus fréquente : la ligne de séparation est manquante ou mal formée. Chaque tableau a besoin d'une ligne ",[33,1121,1122],{},"| --- | --- |"," entre les lignes d'en-tête et de données. Si vous l'oubliez, l'analyseur verra du texte brut, pas un tableau.",[369,1125,1127],{"id":1126},"les-colonnes-sont-mal-alignées-dans-le-rendu","\"Les colonnes sont mal alignées dans le rendu\"",[11,1129,1130],{},"Si une cellule contient plus de contenu que les autres, certains moteurs de rendu étireront cette colonne. C'est un comportement normal, les tableaux Markdown s'adaptent à la largeur du contenu. Vous ne pouvez pas définir de largeurs de colonnes fixes en Markdown.",[369,1132,1134],{"id":1133},"mon-caractère-barre-verticale-saffiche-comme-un-séparateur-de-colonne","\"Mon caractère barre verticale s'affiche comme un séparateur de colonne\"",[11,1136,1137,1138,175,1140,1142],{},"Échappez-le : ",[33,1139,352],{},[33,1141,356],{},". Voir la section ci-dessus sur l'échappement.",[369,1144,1146],{"id":1145},"les-sauts-de-ligne-dans-les-cellules-ne-fonctionnent-pas","\"Les sauts de ligne dans les cellules ne fonctionnent pas\"",[11,1148,1149,1150,1152,1153,1155],{},"Le Markdown standard ne prend pas cela en charge. Utilisez ",[33,1151,378],{}," pour les sauts de ligne dans les cellules. Si ",[33,1154,378],{}," ne fonctionne pas, votre moteur de rendu supprime probablement les balises HTML, vérifiez sa documentation.",[18,1157,1159],{"id":1158},"référence-rapide","Référence rapide",[26,1161,1163],{"className":28,"code":1162,"language":30,"meta":31,"style":31},"# Tableau de base\n| En-tête 1 | En-tête 2 |\n| --------- | --------- |\n| Cellule 1 | Cellule 2 |\n\n\n# Alignement\n| Gauche | Centre | Droite |\n| :----- | :----: | -----: |\n| A      |   B    |      C |\n\n\n# Formatage\n| Fonctionnalité| Statut   |\n| ------------- | -------- |\n| **Gras** | `code`   |\n| *Italique* | [Lien]() |\n\n\n# Échapper le pipe\n| A \\| B | C | D |\n\n\n# Saut de ligne dans une cellule\n| Étape | Faites ceci\u003Cbr>Puis cela |\n",[33,1164,1165,1170,1175,1180,1185,1189,1193,1198,1203,1208,1213,1217,1222,1228,1234,1240,1246,1252,1257,1262,1268,1274,1279,1284,1290],{"__ignoreMap":31},[36,1166,1167],{"class":38,"line":39},[36,1168,1169],{},"# Tableau de base\n",[36,1171,1172],{"class":38,"line":45},[36,1173,1174],{},"| En-tête 1 | En-tête 2 |\n",[36,1176,1177],{"class":38,"line":51},[36,1178,1179],{},"| --------- | --------- |\n",[36,1181,1182],{"class":38,"line":57},[36,1183,1184],{},"| Cellule 1 | Cellule 2 |\n",[36,1186,1187],{"class":38,"line":63},[36,1188,789],{"emptyLinePlaceholder":788},[36,1190,1191],{"class":38,"line":679},[36,1192,789],{"emptyLinePlaceholder":788},[36,1194,1195],{"class":38,"line":688},[36,1196,1197],{},"# Alignement\n",[36,1199,1200],{"class":38,"line":702},[36,1201,1202],{},"| Gauche | Centre | Droite |\n",[36,1204,1205],{"class":38,"line":716},[36,1206,1207],{},"| :----- | :----: | -----: |\n",[36,1209,1210],{"class":38,"line":730},[36,1211,1212],{},"| A      |   B    |      C |\n",[36,1214,1215],{"class":38,"line":739},[36,1216,789],{"emptyLinePlaceholder":788},[36,1218,1220],{"class":38,"line":1219},12,[36,1221,789],{"emptyLinePlaceholder":788},[36,1223,1225],{"class":38,"line":1224},13,[36,1226,1227],{},"# Formatage\n",[36,1229,1231],{"class":38,"line":1230},14,[36,1232,1233],{},"| Fonctionnalité| Statut   |\n",[36,1235,1237],{"class":38,"line":1236},15,[36,1238,1239],{},"| ------------- | -------- |\n",[36,1241,1243],{"class":38,"line":1242},16,[36,1244,1245],{},"| **Gras** | `code`   |\n",[36,1247,1249],{"class":38,"line":1248},17,[36,1250,1251],{},"| *Italique* | [Lien]() |\n",[36,1253,1255],{"class":38,"line":1254},18,[36,1256,789],{"emptyLinePlaceholder":788},[36,1258,1260],{"class":38,"line":1259},19,[36,1261,789],{"emptyLinePlaceholder":788},[36,1263,1265],{"class":38,"line":1264},20,[36,1266,1267],{},"# Échapper le pipe\n",[36,1269,1271],{"class":38,"line":1270},21,[36,1272,1273],{},"| A \\| B | C | D |\n",[36,1275,1277],{"class":38,"line":1276},22,[36,1278,789],{"emptyLinePlaceholder":788},[36,1280,1282],{"class":38,"line":1281},23,[36,1283,789],{"emptyLinePlaceholder":788},[36,1285,1287],{"class":38,"line":1286},24,[36,1288,1289],{},"# Saut de ligne dans une cellule\n",[36,1291,1293],{"class":38,"line":1292},25,[36,1294,1295],{},"| Étape | Faites ceci\u003Cbr>Puis cela |\n",[1297,1298],"hr",{},[11,1300,1301,1302,1304],{},"Les tableaux Markdown couvrent 90 % des données structurées dont vous aurez besoin dans un fichier ",[33,1303,126],{},". Pour les 10 % restants (cellules fusionnées, légendes, mises en page complexes), le HTML est là pour ça.",[11,1306,1307],{},"La clé est de savoir quand utiliser l'un ou l'autre.",[11,1309,1310,1311,604],{},"Pour savoir comment séparer proprement des sections autour de vos tableaux, lisez notre article : ",[251,1312,1314],{"href":1313},"\u002Ffr\u002Fblog\u002Fcomment-ajouter-une-ligne-horizontale-markdown","Comment ajouter une ligne horizontale en Markdown",[11,1316,1317],{},"Si vous cherchez un visualiseur Markdown qui affiche proprement les tableaux sur tous vos appareils, avec une coloration syntaxique et une expérience de lecture soignée, jetez un œil à Fude.",[11,1319,1320,1321],{},"📌 ",[251,1322,1324],{"href":1323},"\u002Ffr#download","Télécharger Fude",[1326,1327,1328],"style",{},"html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .s9eBZ, html code.shiki .s9eBZ{--shiki-default:#22863A;--shiki-dark:#85E89D}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}",{"title":31,"searchDepth":45,"depth":45,"links":1330},[1331,1332,1333,1334,1335,1339,1340,1341,1342,1343,1344,1345,1346,1352],{"id":20,"depth":45,"text":21},{"id":130,"depth":45,"text":131},{"id":214,"depth":45,"text":215},{"id":311,"depth":45,"text":312},{"id":360,"depth":45,"text":361,"children":1336},[1337,1338],{"id":371,"depth":51,"text":372},{"id":410,"depth":51,"text":411},{"id":452,"depth":45,"text":453},{"id":593,"depth":45,"text":594},{"id":751,"depth":45,"text":752},{"id":902,"depth":45,"text":903},{"id":970,"depth":45,"text":971},{"id":1029,"depth":45,"text":1030},{"id":1067,"depth":45,"text":1068},{"id":1108,"depth":45,"text":1109,"children":1347},[1348,1349,1350,1351],{"id":1112,"depth":51,"text":1113},{"id":1126,"depth":51,"text":1127},{"id":1133,"depth":51,"text":1134},{"id":1145,"depth":51,"text":1146},{"id":1158,"depth":45,"text":1159},"markdown-guides","2026-04-13","Apprenez à créer, aligner et formater des tableaux Markdown. Couvre la syntaxe, les cellules multilignes, les solutions de fusion et le comportement spécifique aux outils comme GitHub, Obsidian, et plus.","md","\u002Fimages\u002Fblog\u002Fblog2","Guide complet pour créer des tableaux Markdown",{},false,"\u002Ffr\u002Fblog\u002Fmarkdown-tableaux-guide-complet",{"title":5,"description":1355},"fr\u002Fblog\u002F2.markdown-tableaux-guide-complet",null,"markdown-table-guide","1twpmZiyqKOBHdYu-fxoDzF1nlVS4pLG7spyPsRczLg","\u003Cp>\u003Cspan data-fude-source-start=\"1\" data-fude-source-end=\"303\">Les tableaux Markdown semblent intimidants en texte brut. Des barres verticales partout, des tirets qui s'alignent (ou pas), du contenu qui refuse de rester dans sa colonne. Mais la syntaxe est en réalité simple une fois que vous avez compris ses trois parties : l'en-tête, le séparateur et les lignes.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cp>\u003Cspan data-fude-source-start=\"305\" data-fude-source-end=\"399\">Voici tout ce que j'ai appris sur les tableaux Markdown, des bases jusqu'aux cas particuliers.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Ch2>\u003Cspan data-fude-source-start=\"404\" data-fude-source-end=\"422\">La syntaxe de base\u003C\u002Fspan>\u003C\u002Fh2>\n\u003Cp>\u003Cspan data-fude-source-start=\"424\" data-fude-source-end=\"555\">Un tableau Markdown comporte trois composants : une ligne d'en-tête, une ligne de séparation et une ou plusieurs lignes de données.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cpre style=\"background-color:var(--fude-code-background, var(--color-code-bg));color:var(--fude-code-foreground, var(--color-code-text))\" tabindex=\"0\" class=\"shiki fude-code-theme fude-code-block\" data-language=\"markdown\" data-fude-code-block-start=\"569\" data-fude-code-block-end=\"743\">\u003Ccode class=\"language-markdown\" data-language=\"markdown\" data-fude-code-block-start=\"569\" data-fude-code-block-end=\"743\">\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Nom     | Rôle      | Lieu     |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">-------\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> | \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">---------\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> | \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">--------\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Alice   | Dev       | Paris    |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Bob     | Designer  | Lyon     |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Charlie | PM        | Remote   |\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>\u003Cspan data-fude-source-start=\"749\" data-fude-source-end=\"761\">Les règles :\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cul>\n\u003Cli>\u003Cspan data-fude-source-start=\"765\" data-fude-source-end=\"774\">Utilisez \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"774\" data-fude-source-end=\"777\">|\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"777\" data-fude-source-end=\"830\"> (barre verticale ou pipe) pour séparer les colonnes.\u003C\u002Fspan>\u003C\u002Fli>\n\u003Cli>\u003Cspan data-fude-source-start=\"833\" data-fude-source-end=\"842\">Utilisez \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"842\" data-fude-source-end=\"847\">---\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"847\" data-fude-source-end=\"927\"> (trois tirets ou plus) dans la ligne de séparation pour définir chaque colonne.\u003C\u002Fspan>\u003C\u002Fli>\n\u003Cli>\u003Cspan data-fude-source-start=\"930\" data-fude-source-end=\"1116\">Ajoutez une barre verticale au début et à la fin de chaque ligne. C'est techniquement facultatif dans certains outils de rendu, mais faites-le toujours pour des raisons de compatibilité.\u003C\u002Fspan>\u003C\u002Fli>\n\u003Cli>\u003Cspan data-fude-source-start=\"1119\" data-fude-source-end=\"1231\">Laissez une ligne vide avant le tableau. Sans cela, certains moteurs de rendu ne l'analyseront pas correctement.\u003C\u002Fspan>\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Cp>\u003Cspan data-fude-source-start=\"1233\" data-fude-source-end=\"1323\">Les largeurs des cellules n'ont pas besoin de correspondre. Ceci est parfaitement valide :\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cpre style=\"background-color:var(--fude-code-background, var(--color-code-bg));color:var(--fude-code-foreground, var(--color-code-text))\" tabindex=\"0\" class=\"shiki fude-code-theme fude-code-block\" data-language=\"markdown\" data-fude-code-block-start=\"1337\" data-fude-code-block-end=\"1409\">\u003Ccode class=\"language-markdown\" data-language=\"markdown\" data-fude-code-block-start=\"1337\" data-fude-code-block-end=\"1409\">\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Nom | Rôle |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">---\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> | \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">---\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Alice | Développeuse |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Bob | Designer |\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>\u003Cspan data-fude-source-start=\"1415\" data-fude-source-end=\"1625\">Le rendu sera identique, que vous aligniez les barres verticales dans le fichier source ou non. L'alignement dans le fichier brut est purement cosmétique, il aide à la lisibilité lorsque vous ouvrez le fichier \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"1625\" data-fude-source-end=\"1630\">.md\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"1630\" data-fude-source-end=\"1670\"> dans un éditeur de texte, rien de plus.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Ch2>\u003Cspan data-fude-source-start=\"1675\" data-fude-source-end=\"1698\">Alignement des colonnes\u003C\u002Fspan>\u003C\u002Fh2>\n\u003Cp>\u003Cspan data-fude-source-start=\"1700\" data-fude-source-end=\"1817\">Par défaut, le texte est aligné à gauche. Vous pouvez changer cela avec des deux-points dans la ligne de séparation :\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cpre style=\"background-color:var(--fude-code-background, var(--color-code-bg));color:var(--fude-code-foreground, var(--color-code-text))\" tabindex=\"0\" class=\"shiki fude-code-theme fude-code-block\" data-language=\"markdown\" data-fude-code-block-start=\"1831\" data-fude-code-block-end=\"2025\">\u003Ccode class=\"language-markdown\" data-language=\"markdown\" data-fude-code-block-start=\"1831\" data-fude-code-block-end=\"2025\">\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Produit         | En stock |  Prix |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">:--------------\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> | \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">:------:\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> | \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">----:\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Livre Markdown  |   Oui    | 19.99 |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Cheat Sheet     |   Non    |  4.99 |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Pack Stickers   |   Oui    |  2.49 |\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>\u003Cspan data-fude-source-start=\"2031\" data-fude-source-end=\"2067\">Les deux-points fonctionnent ainsi :\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cul>\n\u003Cli>\u003Ccode>\u003Cspan data-fude-source-start=\"2071\" data-fude-source-end=\"2077\">:---\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"2077\" data-fude-source-end=\"2081\"> ou \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"2081\" data-fude-source-end=\"2086\">:--\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"2086\" data-fude-source-end=\"2116\"> aligné à gauche (par défaut).\u003C\u002Fspan>\u003C\u002Fli>\n\u003Cli>\u003Ccode>\u003Cspan data-fude-source-start=\"2119\" data-fude-source-end=\"2126\">:---:\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"2126\" data-fude-source-end=\"2130\"> ou \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"2130\" data-fude-source-end=\"2135\">:-:\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"2135\" data-fude-source-end=\"2143\"> centré.\u003C\u002Fspan>\u003C\u002Fli>\n\u003Cli>\u003Ccode>\u003Cspan data-fude-source-start=\"2146\" data-fude-source-end=\"2152\">---:\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"2152\" data-fude-source-end=\"2156\"> ou \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"2156\" data-fude-source-end=\"2161\">--:\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"2161\" data-fude-source-end=\"2178\"> aligné à droite.\u003C\u002Fspan>\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Cp>\u003Cspan data-fude-source-start=\"2180\" data-fude-source-end=\"2222\">Le nombre de tirets n'a pas d'importance. \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"2222\" data-fude-source-end=\"2228\">:--:\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"2228\" data-fude-source-end=\"2263\"> fonctionne de la même manière que \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"2263\" data-fude-source-end=\"2275\">:--------:\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"2275\" data-fude-source-end=\"2318\">. Seule la position des deux-points compte.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cp>\u003Cspan data-fude-source-start=\"2320\" data-fude-source-end=\"2496\">Un modèle courant : alignez à gauche les colonnes de texte, centrez les colonnes de statut et alignez à droite les nombres. Cela rend les tableaux beaucoup plus faciles à lire.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Ch2>\u003Cspan data-fude-source-start=\"2501\" data-fude-source-end=\"2545\">Formater le texte à l'intérieur des cellules\u003C\u002Fspan>\u003C\u002Fh2>\n\u003Cp>\u003Cspan data-fude-source-start=\"2547\" data-fude-source-end=\"2644\">Vous pouvez utiliser la plupart des formatages Markdown en ligne dans les cellules d'un tableau :\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cul>\n\u003Cli>\u003Cstrong>\u003Cspan data-fude-source-start=\"2650\" data-fude-source-end=\"2654\">Gras\u003C\u002Fspan>\u003C\u002Fstrong>\u003Cspan data-fude-source-start=\"2656\" data-fude-source-end=\"2659\"> : \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"2659\" data-fude-source-end=\"2670\">**texte**\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fli>\n\u003Cli>\u003Cem>\u003Cspan data-fude-source-start=\"2674\" data-fude-source-end=\"2682\">Italique\u003C\u002Fspan>\u003C\u002Fem>\u003Cspan data-fude-source-start=\"2683\" data-fude-source-end=\"2686\"> : \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"2686\" data-fude-source-end=\"2695\">*texte*\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fli>\n\u003Cli>\u003Ccode>\u003Cspan data-fude-source-start=\"2698\" data-fude-source-end=\"2704\">Code\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"2704\" data-fude-source-end=\"2707\"> : \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"2707\" data-fude-source-end=\"2719\">`code`\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fli>\n\u003Cli>\u003Ca href=\"https:\u002F\u002Fexample.com\" data-fude-link-kind=\"external\" rel=\"noopener noreferrer\">\u003Cspan data-fude-source-start=\"2723\" data-fude-source-end=\"2728\">Liens\u003C\u002Fspan>\u003C\u002Fa>\u003Cspan data-fude-source-start=\"2750\" data-fude-source-end=\"2753\"> : \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"2753\" data-fude-source-end=\"2767\">[texte](url)\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fli>\n\u003Cli>\u003Cdel>\u003Cspan data-fude-source-start=\"2772\" data-fude-source-end=\"2777\">Barré\u003C\u002Fspan>\u003C\u002Fdel>\u003Cspan data-fude-source-start=\"2779\" data-fude-source-end=\"2782\"> : \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"2782\" data-fude-source-end=\"2793\">~~texte~~\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Cp>\u003Cspan data-fude-source-start=\"2795\" data-fude-source-end=\"2804\">Exemple :\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cpre style=\"background-color:var(--fude-code-background, var(--color-code-bg));color:var(--fude-code-foreground, var(--color-code-text))\" tabindex=\"0\" class=\"shiki fude-code-theme fude-code-block\" data-language=\"markdown\" data-fude-code-block-start=\"2818\" data-fude-code-block-end=\"3147\">\u003Ccode class=\"language-markdown\" data-language=\"markdown\" data-fude-code-block-start=\"2818\" data-fude-code-block-end=\"3147\">\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Fonctionnalité   | Statut        | Notes                      |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">----------------\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> | \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">-------------\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> | \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">--------------------------\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| **Mode sombre**  | \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string, color-mix(in srgb, var(--color-accent-primary) 78%, var(--color-code-text) 22%))\">`Terminé`\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">     | Livré dans la v2.1         |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| *Synchronisation*| \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string, color-mix(in srgb, var(--color-accent-primary) 78%, var(--color-code-text) 22%))\">`En cours`\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">    | \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-link)\">[\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-keyword, color-mix(in srgb, var(--color-accent-primary) 68%, var(--color-code-text) 32%))\">Voir la PR #42\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-link)\">](https:\u002F\u002F…)\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">|\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| ~~Ancienne feat~~| \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string, color-mix(in srgb, var(--color-accent-primary) 78%, var(--color-code-text) 22%))\">`Supprimée`\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">   | Obsolète dans la v3.0      |\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>\u003Cspan data-fude-source-start=\"3152\" data-fude-source-end=\"3189\">&\nCe que vous ne pouvez généralement \u003C\u002Fspan>\u003Cstrong>\u003Cspan data-fude-source-start=\"3191\" data-fude-source-end=\"3194\">pas\u003C\u002Fspan>\u003C\u002Fstrong>\u003Cspan data-fude-source-start=\"3196\" data-fude-source-end=\"3616\"> utiliser à l'intérieur des cellules de tableau de style GitHub Flavored Markdown (GFM) en tant que syntaxe Markdown : les titres, les citations, les lignes horizontales, les listes ou les blocs de code. Les tableaux analysent le contenu en ligne, pas les éléments de bloc. Les images sont en ligne, donc de nombreux moteurs de rendu les prennent en charge, mais elles peuvent rendre les tableaux plus difficiles à lire.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Ch2>\u003Cspan data-fude-source-start=\"3621\" data-fude-source-end=\"3665\">Échapper le caractère pipe (barre verticale)\u003C\u002Fspan>\u003C\u002Fh2>\n\u003Cp>\u003Cspan data-fude-source-start=\"3667\" data-fude-source-end=\"3675\">Puisque \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"3675\" data-fude-source-end=\"3678\">|\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"3678\" data-fude-source-end=\"3796\"> est le délimiteur de colonne, afficher une vraie barre verticale à l'intérieur d'une cellule nécessite de l'échapper.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cp>\u003Cspan data-fude-source-start=\"3798\" data-fude-source-end=\"3813\">Deux méthodes :\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cpre style=\"background-color:var(--fude-code-background, var(--color-code-bg));color:var(--fude-code-foreground, var(--color-code-text))\" tabindex=\"0\" class=\"shiki fude-code-theme fude-code-block\" data-language=\"markdown\" data-fude-code-block-start=\"3827\" data-fude-code-block-end=\"3942\">\u003Ccode class=\"language-markdown\" data-language=\"markdown\" data-fude-code-block-start=\"3827\" data-fude-code-block-end=\"3942\">\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Syntaxe   | Exemple      |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">---------\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> | \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">------------\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Antislash | A \\| B       |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Code HTML | A | B   |\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>\u003Cspan data-fude-source-start=\"3948\" data-fude-source-end=\"3975\">La méthode de l'antislash (\u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"3975\" data-fude-source-end=\"3979\">\\|\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"3979\" data-fude-source-end=\"4090\">) fonctionne dans le GitHub Flavored Markdown (GFM) et la plupart des outils de rendu modernes. L'entité HTML (\u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"4090\" data-fude-source-end=\"4098\">|\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"4098\" data-fude-source-end=\"4164\">) est la solution de secours universelle, elle fonctionne partout.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Ch2>\u003Cspan data-fude-source-start=\"4169\" data-fude-source-end=\"4205\">Contenu multiligne dans les cellules\u003C\u002Fspan>\u003C\u002Fh2>\n\u003Cp>\u003Cspan data-fude-source-start=\"4207\" data-fude-source-end=\"4441\">Les tableaux GitHub Flavored Markdown (GFM) ne prennent pas nativement en charge les blocs Markdown multilignes au sein d'une seule cellule. En pratique, il vaut mieux traiter chaque cellule comme une ligne unique de contenu en ligne.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cp>\u003Cspan data-fude-source-start=\"4443\" data-fude-source-end=\"4561\">Mais en réalité, on a souvent besoin de plus de quelques mots dans une cellule. Voici les solutions de contournement :\u003C\u002Fspan>\u003C\u002Fp>\n\u003Ch3>\u003Cspan data-fude-source-start=\"4567\" data-fude-source-end=\"4586\">Sauts de ligne HTML\u003C\u002Fspan>\u003C\u002Fh3>\n\u003Cp>\u003Cspan data-fude-source-start=\"4588\" data-fude-source-end=\"4598\">La balise \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"4598\" data-fude-source-end=\"4604\"><br>\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"4604\" data-fude-source-end=\"4654\"> fonctionne dans la plupart des moteurs de rendu :\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cpre style=\"background-color:var(--fude-code-background, var(--color-code-bg));color:var(--fude-code-foreground, var(--color-code-text))\" tabindex=\"0\" class=\"shiki fude-code-theme fude-code-block\" data-language=\"markdown\" data-fude-code-block-start=\"4668\" data-fude-code-block-end=\"4895\">\u003Ccode class=\"language-markdown\" data-language=\"markdown\" data-fude-code-block-start=\"4668\" data-fude-code-block-end=\"4895\">\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Étape | Description                                  |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">-----\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> | \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">--------------------------------------------\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| 1     | Cloner le dépôt<br>Lancer \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string, color-mix(in srgb, var(--color-accent-primary) 78%, var(--color-code-text) 22%))\">`npm install`\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">      |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| 2     | Créer un fichier \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string, color-mix(in srgb, var(--color-accent-primary) 78%, var(--color-code-text) 22%))\">`.env`\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"><br>Ajouter la clé API|\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>\u003Cspan data-fude-source-start=\"4901\" data-fude-source-end=\"5150\">C'est la solution de contournement la plus courante. Elle fonctionne sur GitHub, Obsidian, GitLab, et de nombreux générateurs de sites statiques qui autorisent le HTML en ligne, mais il vaut toujours mieux la tester dans votre moteur de rendu cible.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Ch3>\u003Cspan data-fude-source-start=\"5156\" data-fude-source-end=\"5185\">Listes HTML dans les cellules\u003C\u002Fspan>\u003C\u002Fh3>\n\u003Cp>\u003Cspan data-fude-source-start=\"5187\" data-fude-source-end=\"5270\">Si vous avez besoin de vraies puces à l'intérieur d'une cellule, utilisez le HTML :\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cpre style=\"background-color:var(--fude-code-background, var(--color-code-bg));color:var(--fude-code-foreground, var(--color-code-text))\" tabindex=\"0\" class=\"shiki fude-code-theme fude-code-block\" data-language=\"markdown\" data-fude-code-block-start=\"5284\" data-fude-code-block-end=\"5559\">\u003Ccode class=\"language-markdown\" data-language=\"markdown\" data-fude-code-block-start=\"5284\" data-fude-code-block-end=\"5559\">\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Module | Inclus                                                  |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">------\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> | \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">-------------------------------------------------------\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Base   | <ul><li>Analyseur<\u002Fli><li>Moteur de rendu<\u002Fli><\u002Ful>     |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Extras | <ul><li>Coloration syntaxique<\u002Fli><li>Tableaux<\u002Fli><\u002Ful>|\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>\u003Cspan data-fude-source-start=\"5565\" data-fude-source-end=\"5658\">Tous les moteurs de rendu ne le prennent pas en charge. Parce que les balises de liste comme \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"5658\" data-fude-source-end=\"5664\"><ul>\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"5664\" data-fude-source-end=\"5764\"> sont du HTML de niveau bloc, la compatibilité dans les cellules de tableau varie davantage qu'avec \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"5764\" data-fude-source-end=\"5770\"><br>\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"5770\" data-fude-source-end=\"5941\">. Certains moteurs de rendu les gèrent, d'autres les suppriment, et d'autres encore les affichent de manière incohérente. Testez avant de vous engager dans cette approche.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Ch2>\u003Cspan data-fude-source-start=\"5946\" data-fude-source-end=\"5967\">Tableaux sans en-tête\u003C\u002Fspan>\u003C\u002Fh2>\n\u003Cp>\u003Cspan data-fude-source-start=\"5969\" data-fude-source-end=\"6122\">Dans les tableaux de style GitHub Flavored Markdown (GFM), une ligne d'en-tête est obligatoire. Il n'y a pas moyen de faire autrement avec cette syntaxe.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cp>\u003Cspan data-fude-source-start=\"6124\" data-fude-source-end=\"6254\">Si vous ne voulez pas d'en-tête visible, la meilleure solution de contournement consiste à utiliser des cellules d'en-tête vides :\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cpre style=\"background-color:var(--fude-code-background, var(--color-code-bg));color:var(--fude-code-foreground, var(--color-code-text))\" tabindex=\"0\" class=\"shiki fude-code-theme fude-code-block\" data-language=\"markdown\" data-fude-code-block-start=\"6268\" data-fude-code-block-end=\"6323\">\u003Ccode class=\"language-markdown\" data-language=\"markdown\" data-fude-code-block-start=\"6268\" data-fude-code-block-end=\"6323\">\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">|     |     |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">---\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> | \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">---\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| A1  | B1  |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| A2  | B2  |\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>\u003Cspan data-fude-source-start=\"6329\" data-fude-source-end=\"6399\">La ligne d'en-tête existe toujours dans la sortie HTML (sous la forme \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"6399\" data-fude-source-end=\"6408\"><thead>\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"6408\" data-fude-source-end=\"6584\">), mais visuellement, elle s'affiche comme une ligne vide ou est masquée selon le CSS. Sur GitHub, l'en-tête vide est visible mais discret. Dans Obsidian, cela dépend du thème.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cp>\u003Cspan data-fude-source-start=\"6586\" data-fude-source-end=\"6646\">Une autre approche consiste à utiliser directement le HTML :\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cpre style=\"background-color:var(--fude-code-background, var(--color-code-bg));color:var(--fude-code-foreground, var(--color-code-text))\" tabindex=\"0\" class=\"shiki fude-code-theme fude-code-block\" data-language=\"html\" data-fude-code-block-start=\"6656\" data-fude-code-block-end=\"6740\">\u003Ccode class=\"language-html\" data-language=\"html\" data-fude-code-block-start=\"6656\" data-fude-code-block-end=\"6740\">\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"><\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">table\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">  <\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">tr\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">><\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">td\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>A1<\u002F\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">td\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">><\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">td\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>B1<\u002F\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">td\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">><\u002F\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">tr\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">  <\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">tr\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">><\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">td\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>A2<\u002F\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">td\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">><\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">td\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>B2<\u002F\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">td\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">><\u002F\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">tr\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"><\u002F\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">table\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>\u003Cspan data-fude-source-start=\"6746\" data-fude-source-end=\"6836\">Cela ignore complètement l'en-tête, mais vous perdez la simplicité de la syntaxe Markdown.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Ch2>\u003Cspan data-fude-source-start=\"6841\" data-fude-source-end=\"6873\">Peut-on fusionner des cellules ?\u003C\u002Fspan>\u003C\u002Fh2>\n\u003Cp>\u003Cspan data-fude-source-start=\"6875\" data-fude-source-end=\"6913\">Non. Markdown n'a pas de syntaxe pour \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"6913\" data-fude-source-end=\"6922\">colspan\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"6922\" data-fude-source-end=\"6926\"> ou \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"6926\" data-fude-source-end=\"6935\">rowspan\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"6935\" data-fude-source-end=\"6936\">.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cp>\u003Cspan data-fude-source-start=\"6938\" data-fude-source-end=\"7043\">Si vous avez vraiment besoin de cellules fusionnées, votre seule option est d'écrire le tableau en HTML :\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cpre style=\"background-color:var(--fude-code-background, var(--color-code-bg));color:var(--fude-code-foreground, var(--color-code-text))\" tabindex=\"0\" class=\"shiki fude-code-theme fude-code-block\" data-language=\"html\" data-fude-code-block-start=\"7053\" data-fude-code-block-end=\"7210\">\u003Ccode class=\"language-html\" data-language=\"html\" data-fude-code-block-start=\"7053\" data-fude-code-block-end=\"7210\">\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"><\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">table\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">  <\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">tr\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">    <\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">th\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-function, color-mix(in srgb, var(--color-accent-secondary) 62%, var(--color-code-text) 38%))\"> colspan\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-keyword, color-mix(in srgb, var(--color-accent-primary) 68%, var(--color-code-text) 32%))\">=\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">\"2\"\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>Nom Complet<\u002F\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">th\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">    <\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">th\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>Rôle<\u002F\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">th\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">  <\u002F\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">tr\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">  <\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">tr\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">    <\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">td\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>Alice<\u002F\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">td\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">    <\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">td\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>Martin<\u002F\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">td\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">    <\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">td\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>Dev<\u002F\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">td\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">  <\u002F\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">tr\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"><\u002F\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">table\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>\u003Cspan data-fude-source-start=\"7216\" data-fude-source-end=\"7503\">Cela fonctionne dans tout moteur de rendu qui accepte les tableaux HTML. Mais cela va à l'encontre du but de Markdown : la lisibilité sous forme de code source. Je réserve les tableaux HTML aux cas où la mise en page nécessite vraiment une fusion, ce qui est plus rare qu'on ne le pense.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Ch2>\u003Cspan data-fude-source-start=\"7508\" data-fude-source-end=\"7527\">Ajouter une légende\u003C\u002Fspan>\u003C\u002Fh2>\n\u003Cp>\u003Cspan data-fude-source-start=\"7529\" data-fude-source-end=\"7634\">Les tableaux Markdown standard ne prennent pas en charge les légendes. Aucune syntaxe n'existe pour cela.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cp>\u003Cspan data-fude-source-start=\"7636\" data-fude-source-end=\"7738\">Le contournement le plus simple consiste à ajouter une ligne en italique directement sous le tableau :\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cpre style=\"background-color:var(--fude-code-background, var(--color-code-bg));color:var(--fude-code-foreground, var(--color-code-text))\" tabindex=\"0\" class=\"shiki fude-code-theme fude-code-block\" data-language=\"markdown\" data-fude-code-block-start=\"7752\" data-fude-code-block-end=\"7891\">\u003Ccode class=\"language-markdown\" data-language=\"markdown\" data-fude-code-block-start=\"7752\" data-fude-code-block-end=\"7891\">\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Trimestre | Revenus |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">---------\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> | \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">------:\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Q1        |   120K €|\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Q2        |   145K €|\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">*Tableau 1 : Revenus par trimestre, 2025.*\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>\u003Cspan data-fude-source-start=\"7897\" data-fude-source-end=\"7949\">Pour la sortie HTML, vous pouvez utiliser la balise \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"7949\" data-fude-source-end=\"7960\"><caption>\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"7960\" data-fude-source-end=\"7962\"> :\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cpre style=\"background-color:var(--fude-code-background, var(--color-code-bg));color:var(--fude-code-foreground, var(--color-code-text))\" tabindex=\"0\" class=\"shiki fude-code-theme fude-code-block\" data-language=\"html\" data-fude-code-block-start=\"7972\" data-fude-code-block-end=\"8121\">\u003Ccode class=\"language-html\" data-language=\"html\" data-fude-code-block-start=\"7972\" data-fude-code-block-end=\"8121\">\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"><\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">table\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">  <\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">caption\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>Revenus par trimestre, 2025<\u002F\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">caption\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">  <\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">tr\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">><\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">th\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>Trimestre<\u002F\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">th\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">><\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">th\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>Revenus<\u002F\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">th\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">><\u002F\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">tr\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">  <\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">tr\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">><\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">td\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>Q1<\u002F\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">td\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">><\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">td\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>120K €<\u002F\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">td\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">><\u002F\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">tr\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"><\u002F\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string-expression)\">table\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">>\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>\u003Cspan data-fude-source-start=\"8127\" data-fude-source-end=\"8310\">Si vous utilisez un générateur de site statique (Nuxt Content, Hugo, Astro, etc.), vérifiez s'il propose une extension ou un shortcode pour les légendes de tableaux. Certains le font.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Ch2>\u003Cspan data-fude-source-start=\"8315\" data-fude-source-end=\"8338\">Les tableaux sur GitHub\u003C\u002Fspan>\u003C\u002Fh2>\n\u003Cp>\u003Cspan data-fude-source-start=\"8340\" data-fude-source-end=\"8436\">GitHub Flavored Markdown (GFM) prend entièrement en charge les tableaux. Quelques spécificités :\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cul>\n\u003Cli>\u003Cspan data-fude-source-start=\"8440\" data-fude-source-end=\"8499\">Les barres verticales au début et à la fin des lignes sont \u003C\u002Fspan>\u003Cstrong>\u003Cspan data-fude-source-start=\"8501\" data-fude-source-end=\"8513\">facultatives\u003C\u002Fspan>\u003C\u002Fstrong>\u003Cspan data-fude-source-start=\"8515\" data-fude-source-end=\"8567\"> en GFM, mais je recommande de toujours les inclure.\u003C\u002Fspan>\u003C\u002Fli>\n\u003Cli>\u003Cspan data-fude-source-start=\"8570\" data-fude-source-end=\"8680\">GitHub affiche les tableaux avec un ombrage alterné des lignes (rayures zébrées), ce qui aide à la lisibilité.\u003C\u002Fspan>\u003C\u002Fli>\n\u003Cli>\u003Cspan data-fude-source-start=\"8683\" data-fude-source-end=\"8753\">Le formatage en ligne fonctionne : gras, italique, code, liens, barré.\u003C\u002Fspan>\u003C\u002Fli>\n\u003Cli>\u003Cspan data-fude-source-start=\"8756\" data-fude-source-end=\"8825\">Le HTML à l'intérieur des cellules est partiellement pris en charge. \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"8825\" data-fude-source-end=\"8831\"><br>\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"8831\" data-fude-source-end=\"8952\"> fonctionne bien, mais un HTML plus complexe dans les cellules est moins prévisible et certaines balises sont supprimées.\u003C\u002Fspan>\u003C\u002Fli>\n\u003Cli>\u003Cspan data-fude-source-start=\"8955\" data-fude-source-end=\"9119\">GitHub renvoie automatiquement à la ligne le contenu long des cellules. Pas de défilement horizontal, le texte passe simplement à la ligne suivante dans la cellule.\u003C\u002Fspan>\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Cp>\u003Cspan data-fude-source-start=\"9121\" data-fude-source-end=\"9214\">Un modèle courant dans les issues et PR GitHub : utiliser des tableaux pour des comparaisons.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cpre style=\"background-color:var(--fude-code-background, var(--color-code-bg));color:var(--fude-code-foreground, var(--color-code-text))\" tabindex=\"0\" class=\"shiki fude-code-theme fude-code-block\" data-language=\"markdown\" data-fude-code-block-start=\"9228\" data-fude-code-block-end=\"9479\">\u003Ccode class=\"language-markdown\" data-language=\"markdown\" data-fude-code-block-start=\"9228\" data-fude-code-block-end=\"9479\">\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">## Comparaison\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Approche | Avantages         | Inconvénients           |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">--------\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> | \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">-----------------\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> | \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">-----------------------\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Option A | Simple, rapide    | Fonctionnalités limitées|\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Option B | Riche en options  | Configuration complexe  |\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Ch2>\u003Cspan data-fude-source-start=\"9488\" data-fude-source-end=\"9510\">Les tableaux dans Fude\u003C\u002Fspan>\u003C\u002Fh2>\n\u003Cp>\u003Cspan data-fude-source-start=\"9512\" data-fude-source-end=\"9693\">Dans Fude, les tableaux Markdown standard fonctionnent comme vous vous y attendez. Si votre tableau utilise la syntaxe habituelle de style GitHub, il devrait s'afficher proprement :\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cul>\n\u003Cli>\u003Cspan data-fude-source-start=\"9697\" data-fude-source-end=\"9764\">une ligne d'en-tête, une ligne de séparation et des lignes de corps\u003C\u002Fspan>\u003C\u002Fli>\n\u003Cli>\u003Cspan data-fude-source-start=\"9767\" data-fude-source-end=\"9798\">l'alignement des colonnes avec \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"9798\" data-fude-source-end=\"9804\">:---\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"9804\" data-fude-source-end=\"9806\">, \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"9806\" data-fude-source-end=\"9813\">:---:\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"9813\" data-fude-source-end=\"9817\"> et \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"9817\" data-fude-source-end=\"9823\">---:\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fli>\n\u003Cli>\u003Cspan data-fude-source-start=\"9826\" data-fude-source-end=\"9913\">le formatage en ligne dans les cellules comme le gras, l'italique, le code et les liens\u003C\u002Fspan>\u003C\u002Fli>\n\u003Cli>\u003Cspan data-fude-source-start=\"9916\" data-fude-source-end=\"10098\">Les liens dans les tableaux se comportent comme les liens ailleurs dans Fude. Les liens web s'ouvrent normalement, et les liens Markdown peuvent toujours pointer vers d'autres notes.\u003C\u002Fspan>\u003C\u002Fli>\n\u003Cli>\u003Ccode>\u003Cspan data-fude-source-start=\"10101\" data-fude-source-end=\"10107\"><br>\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"10107\" data-fude-source-end=\"10174\"> à l'intérieur d'une cellule fonctionne, il ajoute un saut de ligne\u003C\u002Fspan>\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Cp>\u003Cspan data-fude-source-start=\"10176\" data-fude-source-end=\"10268\">Si vous vous en tenez à la syntaxe standard des tableaux Markdown, Fude la gérera très bien.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cul>\n\u003Cli>\u003Cspan data-fude-source-start=\"10272\" data-fude-source-end=\"10294\">Les listes HTML comme \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"10294\" data-fude-source-end=\"10317\"><ul><li>...<\u002Fli><\u002Ful>\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"10317\" data-fude-source-end=\"10373\"> à l'intérieur des cellules ne sont pas prises en charge\u003C\u002Fspan>\u003C\u002Fli>\n\u003Cli>\u003Cspan data-fude-source-start=\"10376\" data-fude-source-end=\"10405\">les tableaux HTML bruts avec \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"10405\" data-fude-source-end=\"10414\"><table>\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"10414\" data-fude-source-end=\"10416\">, \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"10416\" data-fude-source-end=\"10427\"><caption>\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"10427\" data-fude-source-end=\"10429\">, \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"10429\" data-fude-source-end=\"10438\">colspan\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"10438\" data-fude-source-end=\"10442\"> ou \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"10442\" data-fude-source-end=\"10451\">rowspan\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"10451\" data-fude-source-end=\"10460\"> non plus\u003C\u002Fspan>\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Ch2>\u003Cspan data-fude-source-start=\"10465\" data-fude-source-end=\"10491\">Les tableaux dans Obsidian\u003C\u002Fspan>\u003C\u002Fh2>\n\u003Cp>\u003Cspan data-fude-source-start=\"10493\" data-fude-source-end=\"10574\">Obsidian prend en charge la syntaxe standard des tableaux Markdown. En pratique :\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cul>\n\u003Cli>\u003Cspan data-fude-source-start=\"10578\" data-fude-source-end=\"10676\">Le mode Aperçu en direct (Live Preview) affiche les tableaux en temps réel pendant que vous tapez.\u003C\u002Fspan>\u003C\u002Fli>\n\u003Cli>\u003Cspan data-fude-source-start=\"10679\" data-fude-source-end=\"10851\">Obsidian dispose d'un éditeur de tableau intégré (clic droit sur un tableau) qui vous permet d'ajouter\u002Fsupprimer des lignes et des colonnes sans toucher à la syntaxe brute.\u003C\u002Fspan>\u003C\u002Fli>\n\u003Cli>\u003Cspan data-fude-source-start=\"10854\" data-fude-source-end=\"10872\">L'alignement avec \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"10872\" data-fude-source-end=\"10875\">:\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"10875\" data-fude-source-end=\"10899\"> fonctionne comme prévu.\u003C\u002Fspan>\u003C\u002Fli>\n\u003Cli>\u003Ccode>\u003Cspan data-fude-source-start=\"10902\" data-fude-source-end=\"10908\"><br>\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"10908\" data-fude-source-end=\"10982\"> dans les cellules fonctionne en mode lecture et en mode aperçu en direct.\u003C\u002Fspan>\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Cp>\u003Cspan data-fude-source-start=\"10984\" data-fude-source-end=\"11068\">Une chose à surveiller : si votre tableau se trouve dans un bloc d'appel (callout) (\u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"11068\" data-fude-source-end=\"11079\">> [!note]\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"11079\" data-fude-source-end=\"11118\">), chaque ligne doit être préfixée par \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"11118\" data-fude-source-end=\"11121\">>\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"11121\" data-fude-source-end=\"11172\">. Cela devient fastidieux pour les grands tableaux.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Ch2>\u003Cspan data-fude-source-start=\"11177\" data-fude-source-end=\"11216\">Quand un tableau n'est pas le bon outil\u003C\u002Fspan>\u003C\u002Fh2>\n\u003Cp>\u003Cspan data-fude-source-start=\"11218\" data-fude-source-end=\"11383\">Les tableaux Markdown fonctionnent bien pour les données structurées sous forme tabulaire avec un nombre constant de colonnes. Ils ne fonctionnent pas bien lorsque :\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cul>\n\u003Cli>\u003Cspan data-fude-source-start=\"11387\" data-fude-source-end=\"11504\">Les cellules contiennent des paragraphes de texte. Le Markdown brut devient illisible et le rendu a l'air à l'étroit.\u003C\u002Fspan>\u003C\u002Fli>\n\u003Cli>\u003Cspan data-fude-source-start=\"11507\" data-fude-source-end=\"11625\">Vous avez besoin de cellules fusionnées, de tableaux imbriqués ou de mises en page complexes. Utilisez plutôt le HTML.\u003C\u002Fspan>\u003C\u002Fli>\n\u003Cli>\u003Cspan data-fude-source-start=\"11628\" data-fude-source-end=\"11751\">Les données sont une simple liste de paires clé-valeur. Une liste de définitions ou même du texte en gras est plus simple :\u003C\u002Fspan>\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Cpre style=\"background-color:var(--fude-code-background, var(--color-code-bg));color:var(--fude-code-foreground, var(--color-code-text))\" tabindex=\"0\" class=\"shiki fude-code-theme fude-code-block\" data-language=\"markdown\" data-fude-code-block-start=\"11765\" data-fude-code-block-end=\"11821\">\u003Ccode class=\"language-markdown\" data-language=\"markdown\" data-fude-code-block-start=\"11765\" data-fude-code-block-end=\"11821\">\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">**Nom :** Alice\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">**Rôle :** Développeuse\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">**Lieu :** Paris\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>\u003Cspan data-fude-source-start=\"11827\" data-fude-source-end=\"11921\">C'est plus facile à lire (et à écrire) qu'un tableau à deux colonnes pour la même information.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Ch2>\u003Cspan data-fude-source-start=\"11926\" data-fude-source-end=\"11957\">Débogage des problèmes courants\u003C\u002Fspan>\u003C\u002Fh2>\n\u003Ch3>\u003Cspan data-fude-source-start=\"11963\" data-fude-source-end=\"11993\">\"Mon tableau ne s'affiche pas\"\u003C\u002Fspan>\u003C\u002Fh3>\n\u003Cp>\u003Cspan data-fude-source-start=\"11995\" data-fude-source-end=\"12075\">La cause la plus fréquente : aucune ligne vide avant le tableau. Ajoutez-en une.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cp>\u003Cspan data-fude-source-start=\"12077\" data-fude-source-end=\"12200\">Deuxième cause la plus fréquente : la ligne de séparation est manquante ou mal formée. Chaque tableau a besoin d'une ligne \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"12200\" data-fude-source-end=\"12215\">| --- | --- |\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"12215\" data-fude-source-end=\"12325\"> entre les lignes d'en-tête et de données. Si vous l'oubliez, l'analyseur verra du texte brut, pas un tableau.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Ch3>\u003Cspan data-fude-source-start=\"12331\" data-fude-source-end=\"12377\">\"Les colonnes sont mal alignées dans le rendu\"\u003C\u002Fspan>\u003C\u002Fh3>\n\u003Cp>\u003Cspan data-fude-source-start=\"12379\" data-fude-source-end=\"12643\">Si une cellule contient plus de contenu que les autres, certains moteurs de rendu étireront cette colonne. C'est un comportement normal, les tableaux Markdown s'adaptent à la largeur du contenu. Vous ne pouvez pas définir de largeurs de colonnes fixes en Markdown.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Ch3>\u003Cspan data-fude-source-start=\"12649\" data-fude-source-end=\"12721\">\"Mon caractère barre verticale s'affiche comme un séparateur de colonne\"\u003C\u002Fspan>\u003C\u002Fh3>\n\u003Cp>\u003Cspan data-fude-source-start=\"12723\" data-fude-source-end=\"12737\">Échappez-le : \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"12737\" data-fude-source-end=\"12741\">\\|\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"12741\" data-fude-source-end=\"12745\"> ou \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"12745\" data-fude-source-end=\"12753\">|\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"12753\" data-fude-source-end=\"12799\">. Voir la section ci-dessus sur l'échappement.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Ch3>\u003Cspan data-fude-source-start=\"12805\" data-fude-source-end=\"12863\">\"Les sauts de ligne dans les cellules ne fonctionnent pas\"\u003C\u002Fspan>\u003C\u002Fh3>\n\u003Cp>\u003Cspan data-fude-source-start=\"12865\" data-fude-source-end=\"12924\">Le Markdown standard ne prend pas cela en charge. Utilisez \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"12924\" data-fude-source-end=\"12930\"><br>\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"12930\" data-fude-source-end=\"12977\"> pour les sauts de ligne dans les cellules. Si \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"12977\" data-fude-source-end=\"12983\"><br>\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"12983\" data-fude-source-end=\"13091\"> ne fonctionne pas, votre moteur de rendu supprime probablement les balises HTML, vérifiez sa documentation.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Ch2>\u003Cspan data-fude-source-start=\"13096\" data-fude-source-end=\"13112\">Référence rapide\u003C\u002Fspan>\u003C\u002Fh2>\n\u003Cpre style=\"background-color:var(--fude-code-background, var(--color-code-bg));color:var(--fude-code-foreground, var(--color-code-text))\" tabindex=\"0\" class=\"shiki fude-code-theme fude-code-block\" data-language=\"markdown\" data-fude-code-block-start=\"13126\" data-fude-code-block-end=\"13562\">\u003Ccode class=\"language-markdown\" data-language=\"markdown\" data-fude-code-block-start=\"13126\" data-fude-code-block-end=\"13562\">\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"># Tableau de base\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| En-tête 1 | En-tête 2 |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">---------\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> | \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">---------\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Cellule 1 | Cellule 2 |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"># Alignement\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Gauche | Centre | Droite |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">:-----\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> | \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">:----:\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> | \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">-----:\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| A      |   B    |      C |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"># Formatage\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Fonctionnalité| Statut   |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">-------------\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> | \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-punctuation, color-mix(in srgb, var(--color-code-text) 78%, var(--color-code-bg) 22%))\">--------\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| **Gras** | \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-string, color-mix(in srgb, var(--color-accent-primary) 78%, var(--color-code-text) 22%))\">`code`\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">   |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| *Italique* | \u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-link)\">[\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-keyword, color-mix(in srgb, var(--color-accent-primary) 68%, var(--color-code-text) 32%))\">Lien\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-token-link)\">]()\u003C\u002Fspan>\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"> |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"># Échapper le pipe\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| A \\| B | C | D |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\"># Saut de ligne dans une cellule\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:var(--fude-code-foreground, var(--color-code-text))\">| Étape | Faites ceci<br>Puis cela |\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Chr>\n\u003Cp>\u003Cspan data-fude-source-start=\"13573\" data-fude-source-end=\"13672\">Les tableaux Markdown couvrent 90 % des données structurées dont vous aurez besoin dans un fichier \u003C\u002Fspan>\u003Ccode>\u003Cspan data-fude-source-start=\"13672\" data-fude-source-end=\"13677\">.md\u003C\u002Fspan>\u003C\u002Fcode>\u003Cspan data-fude-source-start=\"13677\" data-fude-source-end=\"13783\">. Pour les 10 % restants (cellules fusionnées, légendes, mises en page complexes), le HTML est là pour ça.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cp>\u003Cspan data-fude-source-start=\"13785\" data-fude-source-end=\"13837\">La clé est de savoir quand utiliser l'un ou l'autre.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cp>\u003Cspan data-fude-source-start=\"13839\" data-fude-source-end=\"13937\">Pour savoir comment séparer proprement des sections autour de vos tableaux, lisez notre article : \u003C\u002Fspan>\u003Ca href=\"\u002Ffr\u002Fblog\u002Fcomment-ajouter-une-ligne-horizontale-markdown\" data-fude-link-kind=\"unsupported\">\u003Cspan data-fude-source-start=\"13938\" data-fude-source-end=\"13987\">Comment ajouter une ligne horizontale en Markdown\u003C\u002Fspan>\u003C\u002Fa>\u003Cspan data-fude-source-start=\"14045\" data-fude-source-end=\"14046\">.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cp>\u003Cspan data-fude-source-start=\"14048\" data-fude-source-end=\"14238\">Si vous cherchez un visualiseur Markdown qui affiche proprement les tableaux sur tous vos appareils, avec une coloration syntaxique et une expérience de lecture soignée, jetez un œil à Fude.\u003C\u002Fspan>\u003C\u002Fp>\n\u003Cp>\u003Cspan data-fude-source-start=\"14240\" data-fude-source-end=\"14242\">📌 \u003C\u002Fspan>\u003Ca href=\"\u002Ffr#download\" data-fude-link-kind=\"unsupported\">\u003Cspan data-fude-source-start=\"14243\" data-fude-source-end=\"14259\">Télécharger Fude\u003C\u002Fspan>\u003C\u002Fa>\u003C\u002Fp>","\nLes tableaux Markdown semblent intimidants en texte brut. Des barres verticales partout, des tirets qui s'alignent (ou pas), du contenu qui refuse de rester dans sa colonne. Mais la syntaxe est en réalité simple une fois que vous avez compris ses trois parties : l'en-tête, le séparateur et les lignes.\n\nVoici tout ce que j'ai appris sur les tableaux Markdown, des bases jusqu'aux cas particuliers.\n\n## La syntaxe de base\n\nUn tableau Markdown comporte trois composants : une ligne d'en-tête, une ligne de séparation et une ou plusieurs lignes de données.\n\n```markdown\n| Nom     | Rôle      | Lieu     |\n| ------- | --------- | -------- |\n| Alice   | Dev       | Paris    |\n| Bob     | Designer  | Lyon     |\n| Charlie | PM        | Remote   |\n```\n\nLes règles :\n\n- Utilisez `|` (barre verticale ou pipe) pour séparer les colonnes.\n- Utilisez `---` (trois tirets ou plus) dans la ligne de séparation pour définir chaque colonne.\n- Ajoutez une barre verticale au début et à la fin de chaque ligne. C'est techniquement facultatif dans certains outils de rendu, mais faites-le toujours pour des raisons de compatibilité.\n- Laissez une ligne vide avant le tableau. Sans cela, certains moteurs de rendu ne l'analyseront pas correctement.\n\nLes largeurs des cellules n'ont pas besoin de correspondre. Ceci est parfaitement valide :\n\n```markdown\n| Nom | Rôle |\n| --- | --- |\n| Alice | Développeuse |\n| Bob | Designer |\n```\n\nLe rendu sera identique, que vous aligniez les barres verticales dans le fichier source ou non. L'alignement dans le fichier brut est purement cosmétique, il aide à la lisibilité lorsque vous ouvrez le fichier `.md` dans un éditeur de texte, rien de plus.\n\n## Alignement des colonnes\n\nPar défaut, le texte est aligné à gauche. Vous pouvez changer cela avec des deux-points dans la ligne de séparation :\n\n```markdown\n| Produit         | En stock |  Prix |\n| :-------------- | :------: | ----: |\n| Livre Markdown  |   Oui    | 19.99 |\n| Cheat Sheet     |   Non    |  4.99 |\n| Pack Stickers   |   Oui    |  2.49 |\n```\n\nLes deux-points fonctionnent ainsi :\n\n- `:---` ou `:--` aligné à gauche (par défaut).\n- `:---:` ou `:-:` centré.\n- `---:` ou `--:` aligné à droite.\n\nLe nombre de tirets n'a pas d'importance. `:--:` fonctionne de la même manière que `:--------:`. Seule la position des deux-points compte.\n\nUn modèle courant : alignez à gauche les colonnes de texte, centrez les colonnes de statut et alignez à droite les nombres. Cela rend les tableaux beaucoup plus faciles à lire.\n\n## Formater le texte à l'intérieur des cellules\n\nVous pouvez utiliser la plupart des formatages Markdown en ligne dans les cellules d'un tableau :\n\n- **Gras** : `**texte**`\n- *Italique* : `*texte*`\n- `Code` : `` `code` ``\n- [Liens](https:\u002F\u002Fexample.com) : `[texte](url)`\n- ~~Barré~~ : `~~texte~~`\n\nExemple :\n\n```markdown\n| Fonctionnalité   | Statut        | Notes                      |\n| ---------------- | ------------- | -------------------------- |\n| **Mode sombre**  | `Terminé`     | Livré dans la v2.1         |\n| *Synchronisation*| `En cours`    | [Voir la PR #42](https:\u002F\u002F…)|\n| ~~Ancienne feat~~| `Supprimée`   | Obsolète dans la v3.0      |\n```\n&\nCe que vous ne pouvez généralement **pas** utiliser à l'intérieur des cellules de tableau de style GitHub Flavored Markdown (GFM) en tant que syntaxe Markdown : les titres, les citations, les lignes horizontales, les listes ou les blocs de code. Les tableaux analysent le contenu en ligne, pas les éléments de bloc. Les images sont en ligne, donc de nombreux moteurs de rendu les prennent en charge, mais elles peuvent rendre les tableaux plus difficiles à lire.\n\n## Échapper le caractère pipe (barre verticale)\n\nPuisque `|` est le délimiteur de colonne, afficher une vraie barre verticale à l'intérieur d'une cellule nécessite de l'échapper.\n\nDeux méthodes :\n\n```markdown\n| Syntaxe   | Exemple      |\n| --------- | ------------ |\n| Antislash | A \\| B       |\n| Code HTML | A | B   |\n```\n\nLa méthode de l'antislash (`\\|`) fonctionne dans le GitHub Flavored Markdown (GFM) et la plupart des outils de rendu modernes. L'entité HTML (`|`) est la solution de secours universelle, elle fonctionne partout.\n\n## Contenu multiligne dans les cellules\n\nLes tableaux GitHub Flavored Markdown (GFM) ne prennent pas nativement en charge les blocs Markdown multilignes au sein d'une seule cellule. En pratique, il vaut mieux traiter chaque cellule comme une ligne unique de contenu en ligne.\n\nMais en réalité, on a souvent besoin de plus de quelques mots dans une cellule. Voici les solutions de contournement :\n\n### Sauts de ligne HTML\n\nLa balise `\u003Cbr>` fonctionne dans la plupart des moteurs de rendu :\n\n```markdown\n| Étape | Description                                  |\n| ----- | -------------------------------------------- |\n| 1     | Cloner le dépôt\u003Cbr>Lancer `npm install`      |\n| 2     | Créer un fichier `.env`\u003Cbr>Ajouter la clé API|\n```\n\nC'est la solution de contournement la plus courante. Elle fonctionne sur GitHub, Obsidian, GitLab, et de nombreux générateurs de sites statiques qui autorisent le HTML en ligne, mais il vaut toujours mieux la tester dans votre moteur de rendu cible.\n\n### Listes HTML dans les cellules\n\nSi vous avez besoin de vraies puces à l'intérieur d'une cellule, utilisez le HTML :\n\n```markdown\n| Module | Inclus                                                  |\n| ------ | ------------------------------------------------------- |\n| Base   | \u003Cul>\u003Cli>Analyseur\u003C\u002Fli>\u003Cli>Moteur de rendu\u003C\u002Fli>\u003C\u002Ful>     |\n| Extras | \u003Cul>\u003Cli>Coloration syntaxique\u003C\u002Fli>\u003Cli>Tableaux\u003C\u002Fli>\u003C\u002Ful>|\n```\n\nTous les moteurs de rendu ne le prennent pas en charge. Parce que les balises de liste comme `\u003Cul>` sont du HTML de niveau bloc, la compatibilité dans les cellules de tableau varie davantage qu'avec `\u003Cbr>`. Certains moteurs de rendu les gèrent, d'autres les suppriment, et d'autres encore les affichent de manière incohérente. Testez avant de vous engager dans cette approche.\n\n## Tableaux sans en-tête\n\nDans les tableaux de style GitHub Flavored Markdown (GFM), une ligne d'en-tête est obligatoire. Il n'y a pas moyen de faire autrement avec cette syntaxe.\n\nSi vous ne voulez pas d'en-tête visible, la meilleure solution de contournement consiste à utiliser des cellules d'en-tête vides :\n\n```markdown\n|     |     |\n| --- | --- |\n| A1  | B1  |\n| A2  | B2  |\n```\n\nLa ligne d'en-tête existe toujours dans la sortie HTML (sous la forme `\u003Cthead>`), mais visuellement, elle s'affiche comme une ligne vide ou est masquée selon le CSS. Sur GitHub, l'en-tête vide est visible mais discret. Dans Obsidian, cela dépend du thème.\n\nUne autre approche consiste à utiliser directement le HTML :\n\n```html\n\u003Ctable>\n  \u003Ctr>\u003Ctd>A1\u003C\u002Ftd>\u003Ctd>B1\u003C\u002Ftd>\u003C\u002Ftr>\n  \u003Ctr>\u003Ctd>A2\u003C\u002Ftd>\u003Ctd>B2\u003C\u002Ftd>\u003C\u002Ftr>\n\u003C\u002Ftable>\n```\n\nCela ignore complètement l'en-tête, mais vous perdez la simplicité de la syntaxe Markdown.\n\n## Peut-on fusionner des cellules ?\n\nNon. Markdown n'a pas de syntaxe pour `colspan` ou `rowspan`.\n\nSi vous avez vraiment besoin de cellules fusionnées, votre seule option est d'écrire le tableau en HTML :\n\n```html\n\u003Ctable>\n  \u003Ctr>\n    \u003Cth colspan=\"2\">Nom Complet\u003C\u002Fth>\n    \u003Cth>Rôle\u003C\u002Fth>\n  \u003C\u002Ftr>\n  \u003Ctr>\n    \u003Ctd>Alice\u003C\u002Ftd>\n    \u003Ctd>Martin\u003C\u002Ftd>\n    \u003Ctd>Dev\u003C\u002Ftd>\n  \u003C\u002Ftr>\n\u003C\u002Ftable>\n```\n\nCela fonctionne dans tout moteur de rendu qui accepte les tableaux HTML. Mais cela va à l'encontre du but de Markdown : la lisibilité sous forme de code source. Je réserve les tableaux HTML aux cas où la mise en page nécessite vraiment une fusion, ce qui est plus rare qu'on ne le pense.\n\n## Ajouter une légende\n\nLes tableaux Markdown standard ne prennent pas en charge les légendes. Aucune syntaxe n'existe pour cela.\n\nLe contournement le plus simple consiste à ajouter une ligne en italique directement sous le tableau :\n\n```markdown\n| Trimestre | Revenus |\n| --------- | ------: |\n| Q1        |   120K €|\n| Q2        |   145K €|\n\n*Tableau 1 : Revenus par trimestre, 2025.*\n```\n\nPour la sortie HTML, vous pouvez utiliser la balise `\u003Ccaption>` :\n\n```html\n\u003Ctable>\n  \u003Ccaption>Revenus par trimestre, 2025\u003C\u002Fcaption>\n  \u003Ctr>\u003Cth>Trimestre\u003C\u002Fth>\u003Cth>Revenus\u003C\u002Fth>\u003C\u002Ftr>\n  \u003Ctr>\u003Ctd>Q1\u003C\u002Ftd>\u003Ctd>120K €\u003C\u002Ftd>\u003C\u002Ftr>\n\u003C\u002Ftable>\n```\n\nSi vous utilisez un générateur de site statique (Nuxt Content, Hugo, Astro, etc.), vérifiez s'il propose une extension ou un shortcode pour les légendes de tableaux. Certains le font.\n\n## Les tableaux sur GitHub\n\nGitHub Flavored Markdown (GFM) prend entièrement en charge les tableaux. Quelques spécificités :\n\n- Les barres verticales au début et à la fin des lignes sont **facultatives** en GFM, mais je recommande de toujours les inclure.\n- GitHub affiche les tableaux avec un ombrage alterné des lignes (rayures zébrées), ce qui aide à la lisibilité.\n- Le formatage en ligne fonctionne : gras, italique, code, liens, barré.\n- Le HTML à l'intérieur des cellules est partiellement pris en charge. `\u003Cbr>` fonctionne bien, mais un HTML plus complexe dans les cellules est moins prévisible et certaines balises sont supprimées.\n- GitHub renvoie automatiquement à la ligne le contenu long des cellules. Pas de défilement horizontal, le texte passe simplement à la ligne suivante dans la cellule.\n\nUn modèle courant dans les issues et PR GitHub : utiliser des tableaux pour des comparaisons.\n\n```markdown\n## Comparaison\n\n| Approche | Avantages         | Inconvénients           |\n| -------- | ----------------- | ----------------------- |\n| Option A | Simple, rapide    | Fonctionnalités limitées|\n| Option B | Riche en options  | Configuration complexe  |\n```\n\n## Les tableaux dans Fude\n\nDans Fude, les tableaux Markdown standard fonctionnent comme vous vous y attendez. Si votre tableau utilise la syntaxe habituelle de style GitHub, il devrait s'afficher proprement :\n\n- une ligne d'en-tête, une ligne de séparation et des lignes de corps\n- l'alignement des colonnes avec `:---`, `:---:` et `---:`\n- le formatage en ligne dans les cellules comme le gras, l'italique, le code et les liens\n- Les liens dans les tableaux se comportent comme les liens ailleurs dans Fude. Les liens web s'ouvrent normalement, et les liens Markdown peuvent toujours pointer vers d'autres notes.\n- `\u003Cbr>` à l'intérieur d'une cellule fonctionne, il ajoute un saut de ligne\n\nSi vous vous en tenez à la syntaxe standard des tableaux Markdown, Fude la gérera très bien.\n\n- Les listes HTML comme `\u003Cul>\u003Cli>...\u003C\u002Fli>\u003C\u002Ful>` à l'intérieur des cellules ne sont pas prises en charge\n- les tableaux HTML bruts avec `\u003Ctable>`, `\u003Ccaption>`, `colspan` ou `rowspan` non plus\n\n## Les tableaux dans Obsidian\n\nObsidian prend en charge la syntaxe standard des tableaux Markdown. En pratique :\n\n- Le mode Aperçu en direct (Live Preview) affiche les tableaux en temps réel pendant que vous tapez.\n- Obsidian dispose d'un éditeur de tableau intégré (clic droit sur un tableau) qui vous permet d'ajouter\u002Fsupprimer des lignes et des colonnes sans toucher à la syntaxe brute.\n- L'alignement avec `:` fonctionne comme prévu.\n- `\u003Cbr>` dans les cellules fonctionne en mode lecture et en mode aperçu en direct.\n\nUne chose à surveiller : si votre tableau se trouve dans un bloc d'appel (callout) (`> [!note]`), chaque ligne doit être préfixée par `>`. Cela devient fastidieux pour les grands tableaux.\n\n## Quand un tableau n'est pas le bon outil\n\nLes tableaux Markdown fonctionnent bien pour les données structurées sous forme tabulaire avec un nombre constant de colonnes. Ils ne fonctionnent pas bien lorsque :\n\n- Les cellules contiennent des paragraphes de texte. Le Markdown brut devient illisible et le rendu a l'air à l'étroit.\n- Vous avez besoin de cellules fusionnées, de tableaux imbriqués ou de mises en page complexes. Utilisez plutôt le HTML.\n- Les données sont une simple liste de paires clé-valeur. Une liste de définitions ou même du texte en gras est plus simple :\n\n```markdown\n**Nom :** Alice\n**Rôle :** Développeuse\n**Lieu :** Paris\n```\n\nC'est plus facile à lire (et à écrire) qu'un tableau à deux colonnes pour la même information.\n\n## Débogage des problèmes courants\n\n### \"Mon tableau ne s'affiche pas\"\n\nLa cause la plus fréquente : aucune ligne vide avant le tableau. Ajoutez-en une.\n\nDeuxième cause la plus fréquente : la ligne de séparation est manquante ou mal formée. Chaque tableau a besoin d'une ligne `| --- | --- |` entre les lignes d'en-tête et de données. Si vous l'oubliez, l'analyseur verra du texte brut, pas un tableau.\n\n### \"Les colonnes sont mal alignées dans le rendu\"\n\nSi une cellule contient plus de contenu que les autres, certains moteurs de rendu étireront cette colonne. C'est un comportement normal, les tableaux Markdown s'adaptent à la largeur du contenu. Vous ne pouvez pas définir de largeurs de colonnes fixes en Markdown.\n\n### \"Mon caractère barre verticale s'affiche comme un séparateur de colonne\"\n\nÉchappez-le : `\\|` ou `|`. Voir la section ci-dessus sur l'échappement.\n\n### \"Les sauts de ligne dans les cellules ne fonctionnent pas\"\n\nLe Markdown standard ne prend pas cela en charge. Utilisez `\u003Cbr>` pour les sauts de ligne dans les cellules. Si `\u003Cbr>` ne fonctionne pas, votre moteur de rendu supprime probablement les balises HTML, vérifiez sa documentation.\n\n## Référence rapide\n\n```markdown\n# Tableau de base\n| En-tête 1 | En-tête 2 |\n| --------- | --------- |\n| Cellule 1 | Cellule 2 |\n\n\n# Alignement\n| Gauche | Centre | Droite |\n| :----- | :----: | -----: |\n| A      |   B    |      C |\n\n\n# Formatage\n| Fonctionnalité| Statut   |\n| ------------- | -------- |\n| **Gras** | `code`   |\n| *Italique* | [Lien]() |\n\n\n# Échapper le pipe\n| A \\| B | C | D |\n\n\n# Saut de ligne dans une cellule\n| Étape | Faites ceci\u003Cbr>Puis cela |\n```\n\n---\n\nLes tableaux Markdown couvrent 90 % des données structurées dont vous aurez besoin dans un fichier `.md`. Pour les 10 % restants (cellules fusionnées, légendes, mises en page complexes), le HTML est là pour ça.\n\nLa clé est de savoir quand utiliser l'un ou l'autre.\n\nPour savoir comment séparer proprement des sections autour de vos tableaux, lisez notre article : [Comment ajouter une ligne horizontale en Markdown](\u002Ffr\u002Fblog\u002Fcomment-ajouter-une-ligne-horizontale-markdown).\n\nSi vous cherchez un visualiseur Markdown qui affiche proprement les tableaux sur tous vos appareils, avec une coloration syntaxique et une expérience de lecture soignée, jetez un œil à Fude.\n\n📌 [Télécharger Fude](\u002Ffr#download)\n",[1370,1373],{"locale":1371,"slug":1372},"en","markdown-table-complete-guide-with-examples",{"locale":1374,"slug":1375},"fr","markdown-tableaux-guide-complet",{"title":1377,"path":1378,"stem":1379,"description":1380,"children":-1},"Fude, un lecteur Markdown pour l'ère de l'IA","\u002Ffr\u002Fblog\u002Ffude-lecteur-markdown-ere-ia","fr\u002Fblog\u002F1.fude-lecteur-markdown-ere-ia","Avec l'avènement de l'IA, le Markdown est devenu incontournable. Je crée le lecteur Markdown ultime : propre, synchronisé, prêt pour les agents IA, disponible sur Mac, Windows, iOS et Android.",{"title":1314,"path":1313,"stem":1382,"description":1383,"children":-1},"fr\u002Fblog\u002F3.comment-ajouter-une-ligne-horizontale-markdown","Découvrez comment ajouter une ligne horizontale dans un fichier Markdown, éviter les pièges courants et personnaliser son design.",1776593810849]