Ajouter des images à README.md sur GitHub


1846

Récemment, j'ai rejoint GitHub . J'y ai hébergé des projets.

Je dois inclure des images dans mon fichier README. Je ne sais pas comment faire ça.

J'ai cherché à ce sujet, mais tout ce que j'ai obtenu était quelques liens qui me disent "d'héberger des images sur le Web et de spécifier le chemin de l'image dans le fichier README.md".

Existe-t-il un moyen de le faire sans héberger les images sur des services d'hébergement Web tiers?



5
Duplicate de stackoverflow.com/questions/10189356/… qui a été publié en 2012.
leetNightshade

86
Pas hors sujet, GitHub est un outil de programmeur.
Lance Roberts

Réponses:


1890

Essayez cette démarque:

![alt text](http://url/to/img.png)

Je pense que vous pouvez créer un lien direct vers la version brute d'une image si elle est stockée dans votre référentiel. c'est à dire

![alt text](https://github.com/[username]/[reponame]/blob/[branch]/image.jpg?raw=true)

138
Vous devriez également envisager d'utiliser des liens relatifs
mgalgs

53
Les liens relatifs ne sont pas d'une grande utilité ici, imaginez que votre fichier Lisez-moi est également affiché sur npm qui n'héberge pas l'image de cette façon - il doit être lié à GitHub. Les srcs d'image doivent se trouver sur le domaine github.com , pas sur le sous-domaine raw.github.com et non sur le domaine raw.githubusercontent.com .
Lee Crossley

4
En fait, j'ai fini par suivre les chemins relatifs (qui pour moi n'est que le nom du fichier image car j'ai tout en racine). J'avais conservé 2 copies de README.md, une pour l'installation locale dans / usr / share / projectname / docs et une pour github. Maintenant, je peux simplement utiliser le même fichier README.md pour les deux, car les noms de fichiers d'image fonctionnent correctement dans les deux cas. Si je veux publier une copie de parties de mon fichier README ailleurs, je devrai héberger les images ailleurs ou les mettre dans l'url raw.github.com.
Colin Keenan

15
GitHub recommande lui-même les chemins relatifs: help.github.com/articles/relative-links-in-readmes Un inconvénient majeur des chemins absolus est que, si l'image est déplacée dans master, d'autres branches qui pointent toujours vers l'ancienne URL se briseront.
Jack O'Connor

3
Le domaine actuellement suggéré ne semble pas fonctionner et le lien devrait être comme ceci:https://github.com/[username]/[reponame]/blob/[branch]/image.jpg?raw=true
Slavik Shynkarenko

426

Vous pouvez également utiliser des chemins relatifs comme

![Alt text](relative/path/to/img.jpg?raw=true "Title")

16
Oui. Ceci est de loin le moyen le plus facile à moins que vous êtes inquiet au sujet performance.I'd noter que c'est par rapport au répertoire pas prises en pension , donc si vous avez « myimage.png » dans le même répertoire que « about_pics.md » alors le balisage est:![What is this](myimage.png)
Rich

5
C'est une solution géniale car 1) ça marche 2) les images sont aussi montrées dans une visionneuse locale, sans besoin d'accès à Internet
Régis B.

2
@Rich pouvez-vous développer votre commentaire concernant les performances. Quels sont les problèmes de performances liés à l'approche du chemin relatif?
Lea Hayes

2
Ce chemin est relatif à quoi?
Dims

2
Comme l'a souligné Lee Crossley, vous devez éviter les liens relatifs car ils se cassent lorsque votre fichier Lisez-moi est affiché sur npm. Au lieu de cela, liez à l'image src sur le domaine github.com avec l' indicateur "? Sanitize = true" si le format d'image est quelque chose comme SVG. Voir plus de détails à cette réponse SO: stackoverflow.com/a/16462143/6798201
AlienKevin

231
  • Vous pouvez créer un nouveau problème
  • y télécharger (glisser-déposer) des images
  • Copiez l'URL des images et collez-la dans votre fichier README.md.

voici une vidéo détaillée sur YouTube expliquée en détail:

https://www.youtube.com/watch?v=nvPOUdz5PL4


24
Pour autant que je sache, vous n'avez pas vraiment besoin d' enregistrer le problème. De cette façon, vous n'avez pas vraiment besoin de ces tickets factices dans Issue Tracker. La question est de savoir s'il s'agit d'une méthode "sûre", ce qui signifie que GitHub détectera (après un certain temps) que l'image est orpheline et la supprimera donc du CDN GitHub ??
peterh

3
Cette réponse a parfaitement fonctionné pour moi et n'a pas eu besoin d'enregistrer le nouveau problème dans le référentiel. J'ai trouvé une vidéo sur Youtube qui explique cela en détails: youtube.com/watch?v=nvPOUdz5PL4 .
Francislainy Campos

1
Cette réponse fonctionne et nécessite peu d'efforts. Le problème peut être ignoré, mais l'URL de l'image persiste. L'URL de l'image se présente sous la forme: user-images.githubusercontent.com ...
Sabuncu

6
C'est une super astuce! Mais quelqu'un connaît-il la réponse à la question de @ peterh? GitHub purgera-t-il périodiquement les images orphelines (c'est-à-dire sans problème)?
Johnny Oshika

1
@JohnnyOshika Je doute que quiconque en dehors de github puisse définitivement répondre à cela. Cela peut dépendre de l'utilisation de "user-images.githubusercontent.com". Si ce n'est que pour les images téléchargées dans les commentaires, il est plausible qu'ils puissent rechercher la relation de données manquante et supprimer l'image. S'il est plus général, il peut être difficile de déterminer définitivement qu'il n'y a pas de références au fichier, ce qui rend le calcul coûteux ou difficile à déterminer qu'il peut être supprimé sans problème.
yourbuddypal

128

C'est beaucoup plus simple que ça.

Téléchargez simplement votre image à la racine du référentiel et liez au nom de fichier sans aucun chemin, comme ceci:

![Screenshot](screenshot.png)

10
Non, je ne pense pas que l'ajout de captures d'écran au dépôt git soit une bonne pratique. Surtout pas à la racine. La réponse d'Ahmad Ajmi est bien meilleure
Arnaud P

26
Pas à la racine mais vous pouvez facilement l'adapter docs/imagesou quoi que ce soit, les petites captures d'écran png sont ok IMHO
Christophe Roussy

5
Cela devrait être la solution acceptée, en particulier. avec la suggestion de Christophe de mettre les images sous le doc / arbre /
Mike Ellis

parfait..!! si le png est dans un autre dossier. Ajoutez simplement le chemin "folderName / screenshot.png"
Soumen

J'ai trouvé votre réponse utile pour mon cas: je suis sur Gitlab et j'utilise des logo.pngimages à la racine du dépôt pour définir un avatar sur le dépôt. Je voulais inclure cette photo dans le fichier README.md.
avi.elkharrat

84

Vous pouvez également ajouter des images avec de simples balises HTML :

<p align="center">
  <img src="your_relative_path_here" width="350" title="hover text">
  <img src="your_relative_path_here_number_2_large_name" width="350" alt="accessibility text">
</p>

1
Lorsque vous utilisez des balises HTML à l'intérieur de votre fichier de démarque. Il sera ignoré par Pandoc , un convertisseur de documents universel.
Lorem Ipsum Dolor

1
C'est mieux pour qu'il puisse être centré ou placé sur un côté (pour les images plus petites, au moins.)
Alexis Wilke

Comment spécifiez-vous le chemin relatif? Ce n'est pas relatif à README.md (dans tous les cas?).
friederbluemle

55

Beaucoup de solutions publiées sont incomplètes ou pas à mon goût.

  • Un CDN externe comme imgur ajoute un autre outil à la chaîne. Meh.
  • Créer un problème factice dans le suivi des problèmes est un hack. Il crée de l'encombrement et déroute les utilisateurs. C'est pénible de migrer cette solution vers un fork, ou hors de GitHub.
  • L'utilisation de la branche gh-pages rend les URL fragiles. Une autre personne travaillant sur le projet de maintenance de la page gh peut ne pas savoir que quelque chose d'extérieur dépend du chemin d'accès à ces images. La branche gh-pages a un comportement particulier sur GitHub qui n'est pas nécessaire pour héberger des images CDN.
  • Le suivi des actifs dans le contrôle de version est une bonne chose. Au fur et à mesure qu'un projet grandit et change, c'est un moyen plus durable de gérer et de suivre les changements de plusieurs utilisateurs.
  • Si une image s'applique à une révision spécifique du logiciel, il peut être préférable de lier une image immuable. De cette façon, si l'image est mise à jour ultérieurement pour refléter les modifications apportées au logiciel, toute personne lisant le fichier Lisez-moi de cette révision trouvera l'image correcte.

Ma solution préférée, inspirée de cet essentiel , est d'utiliser une branche d'actifs avec des permaliens vers des révisions spécifiques .

git checkout --orphan assets
git reset --hard
cp /path/to/cat.png .
git add .
git commit -m 'Added cat picture'
git push -u origin assets
git rev-parse HEAD  # Print the SHA, which is optional, you'll see below.

Construisez un «permalien» vers cette révision de l'image et enveloppez-la dans Markdown.

La recherche manuelle du SHA de validation n'est cependant pas pratique, donc comme raccourci, appuyez sur Y pour un lien permanent vers un fichier dans un commit spécifique, comme le dit cette page help.github.

Pour toujours afficher la dernière image sur la branche des ressources, utilisez l'URL de blob:

https://github.com/github/{repository}/blob/assets/cat.png 

(À partir de la même page d'aide de GitHub, les vues de fichier montrent la dernière version sur une branche )


2
C'est un bon complément à la réponse acceptée. Les actifs sont suivis, les images ne sont pas en master, pas de fouillis. Faites juste attention au git reset --hard; assurez-vous que les modifications ont été validées.
dojuba

Dans la nature sur votre machine. Vous pouvez pointer à l' endroit où le fichier se trouve être ( ~/Downloads, /tmp, etc.).
paulmelnikow

Je jure que je me souviens qu'il y a un répertoire que vous pouvez créer qui n'apparaît pas sur Github. Jusqu'à ce que je puisse retrouver cela, ce message semble être la prochaine meilleure chose à utiliser. Merci!
Shadoninja

21

Validez votre image ( image.png ) dans un dossier ( myFolder ) et ajoutez la ligne suivante dans votre fichier README.md :

![Optional Text](../master/myFolder/image.png)


17
  • Créer un problème concernant l'ajout d'images
  • Ajouter l'image par glisser-déposer ou par sélecteur de fichier
  • Copiez ensuite la source de l'image

  • Maintenant, ajoutez ![alt tag](http://url/to/img.png)à votre fichier README.md

Terminé!

Alternativement, vous pouvez utiliser un site d'hébergement d'images comme imguret obtenir son URL et l'ajouter dans votre fichier README.md ou vous pouvez également utiliser un hébergement de fichiers statiques.

Exemple de problème


C'est la façon la plus simple de les ajouter à mon avis. Faites-les simplement glisser dans la boîte, copiez l'adresse et collez-la dans votre fichier Lisez-moi avec les légendes ci-dessous. Boom, vous avez terminé.
Joe Hill

15

Je dois inclure des images dans mon fichier README. Je ne sais pas comment faire ça.

J'ai créé un petit assistant qui vous permet de créer et de personnaliser des galeries d'images simples pour le fichier Lisez- moi de votre référentiel GitHub: Voir ReadmeGalleryCreatorForGitHub .

L'assistant tire parti du fait que GitHub autorise les balises img à apparaître dans le README.md. De plus, l'assistant utilise l'astuce populaire de téléchargement d'images sur GitHub en les glissant-déposant dans la zone de problème (comme déjà mentionné dans l'une des réponses de ce fil).

entrez la description de l'image ici


2
J'adore cet outil!
Dan

1
J'adore aussi cet outil, cela devrait être la fonction par défaut de Git !!
shridutt kothari

14

Ajoutez simplement une <img>balise à votre fichier README.md avec src relatif à votre référentiel. Si vous n'utilisez pas de src relatif, assurez-vous que le serveur prend en charge CORS.

Cela fonctionne parce que GitHub supporte inline-html

<img src="/docs/logo.png" alt="My cool logo"/>
# My cool project and above is the logo of it

Observez ici


13

Syntaxe de base

![myimage-alt-tag](url-to-image)

Ici:

  1. my-image-alt-tag: texte qui sera affiché si l'image n'est pas affichée.
  2. url-to-image: quelle que soit votre ressource d'image. URI de l'image

Exemple:

![stack Overflow](http://lmsotfy.com/so.png)

Cela ressemblera à ceci:

empiler l'image de débordement par alamin


10

Utilisez des tables pour vous démarquer, cela lui donnera un charme distinct

La syntaxe de la table est:

Séparez chaque cellule de colonne par le symbole |

et en-tête de tableau (première ligne) par 2e ligne par ---


| col 1 | col 2 |
| ------------ | ------------- |
| image 1 | image 2 |

production

entrez la description de l'image ici


Maintenant, mettez simplement l' <img src="url/relativePath">image 1 et l'image 2 si vous utilisez deux images


Remarque: si vous utilisez plusieurs images, incluez simplement plus de colonnes, vous pouvez utiliser l'attribut width et height pour le rendre lisible.

Exemple


| col 1 | col 2 |
| ------------ | ------------- |
| <img src="https://media.wired.com/photos/5926db217034dc5f91becd6b/master/w_582,c_limit/so-logo-s.jpg" width="250"> | <img src="https://mk0jobadderjftub56m0.kinstacdn.com/wp-content/uploads/stackoverflow.com-300.jpg" width="250">|

L'espacement n'a pas d'importance

Image de sortie

entrez la description de l'image ici

aidé par: adam-p


5
L'utilisation de tableaux est sans rapport avec le sujet de la question du PO.
mhucka

1
l'ajout de captures d'écran d'une application peut être fait de cette façon, merci
UpaJah

Utilisez CSS au lieu de tableaux, cela fera vibrer votre monde.
jeffmcneill

9

Vous pouvez simplement faire:

git checkout --orphan assets
cp /where/image/currently/located/on/machine/diagram.png .
git add .
git commit -m 'Added diagram'
git push -u origin assets

Ensuite, vous pouvez simplement le référencer dans le READMEfichier comme suit:

![diagram](diagram.png)


1
Parfait et net.
Biswajit Das

1
cela fonctionne, en fait, je pense que cette réponse devrait être acceptée
Luk Aron

8

Dans mon cas, j'utilise imgur et utilise le lien direct de cette façon.

![img](http://i.imgur.com/yourfilename.png)

8

Vous pouvez créer un lien vers les images de votre projet à partir de README.md (ou en externe) à l'aide du lien alternatif github CDN.

L'URL ressemblera à ceci:

https://cdn.rawgit.com/<USER>/<REPO>/<BRANCH>/<PATH>/<TO>/<FILE>

J'ai une image SVG dans mon projet, et quand je la référence dans ma documentation de projet Python, elle ne s'affiche pas.

Lien du projet

Voici le lien du projet vers le fichier (ne s'affiche pas en tant qu'image):

https://github.com/jongracecox/anybadge/blob/master/examples/awesomeness.svg

Exemple d'image intégrée: image

Lien brut

Voici le lien RAW vers le fichier (ne s'affiche toujours pas en tant qu'image):

https://raw.githubusercontent.com/jongracecox/anybadge/master/examples/awesomeness.svg

Exemple d'image intégrée: image

Lien CDN

À l'aide du lien CDN, je peux créer un lien vers le fichier à l'aide de (rendu sous forme d'image):

https://cdn.rawgit.com/jongracecox/anybadge/master/examples/awesomeness.svg

Exemple d'image intégrée: image

C'est ainsi que je peux utiliser des images de mon projet à la fois dans mon README.mdfichier et dans mon projet PyPi reStructredText doucmentation ( ici )


7

J'ai résolu ce problème. Il vous suffit de vous référer au fichier Lisez-moi de quelqu'un d'autre.

Au début, vous devez télécharger un fichier image dans la bibliothèque de codes github! Puis référence directe à l'adresse du fichier image.



entrez la description de l'image ici

entrez la description de l'image ici


6

J'héberge généralement l'image sur le site, cela peut être lié à n'importe quelle image hébergée. Jetez simplement cela dans le fichier Lisez-moi. Fonctionne pour les .rstfichiers, pas sûr.md

.. image:: https://url/path/to/image
   :height: 100px
   :width: 200 px
   :scale: 50 %

5

Dans mon cas, je voulais montrer un écran d'impression Githubmais aussi NPM. Même si l'utilisation du chemin relatif fonctionnait à l'intérieur Github, cela ne fonctionnait pas à l'extérieur. Fondamentalement, même si j'ai également poussé mon projet NPM(qui utilise simplement le mêmereadme.md , l'image ne s'affichait jamais.

J'ai essayé plusieurs façons, à la fin, c'est ce qui a fonctionné pour moi:

![Preview](https://raw.githubusercontent.com/username/project/master/image-path/image.png)

Je vois maintenant correctement mon image sur NPMou ailleurs où je pourrais publier mon package.


5

Si vous avez besoin de télécharger des photos pour la documentation, une bonne approche consiste à utiliser git-lfs . En supposant que vous avez installé git-lfs, procédez comme suit:

  1. Intialisez git lfs pour chaque type d'image:

    git lfs *.png
    git lfs *.svg
    git lfs *.gif
    git lfs *.jpg
    git lfs *.jpeg
    
  2. Créez un dossier qui sera utilisé comme emplacement d'image, par exemple. doc. Sur les systèmes basés sur GNU / Linux et Unix, cela peut être fait via:

    cd project_folder
    mkdir doc
    git add doc
    
  3. Copiez collez toutes les images dans le dossier doc. Ajoutez-les ensuite via la git addcommande.

  4. Engagez-vous et poussez.

  5. Les images sont accessibles au public dans l'url suivante:

    https://media.githubusercontent.com/media/ ^ github_username ^ / ^ repo ^ / ^ branch ^ / ^ image_location dans le repo ^

Où: * ^github_username^est le nom d'utilisateur dans github (vous pouvez le trouver dans la page de profil) * ^repo_name^est le nom du référentiel * ^branch^est la branche du référentiel où l'image est téléchargée * ^image_location in the repo^est l'emplacement, y compris le dossier dans lequel l'image est stockée.

Vous pouvez également télécharger l'image d'abord, puis visiter l'emplacement dans la page github de vos projets et naviguer jusqu'à ce que vous trouviez l'image, puis appuyez sur la touche download bouton, puis copier-coller l'URL de la barre d'adresse du navigateur.

Regardez ceci de mon projet comme référence.

Ensuite, vous pouvez utiliser l'URL pour les inclure en utilisant la syntaxe de démarque mentionnée ci-dessus:

![some alternate text that describes the image](^github generated url from git lfs^)

Par exemple: Supposons que nous utilisons cette photo Ensuite, vous pouvez utiliser la syntaxe de démarque:

![In what order to compile the files](https://media.githubusercontent.com/media/pc-magas/myFirstEnclave/master/doc/SGX%20Compile%20workflow.png)

5

JUSTE CE FONCTIONNE !!

prenez soin de votre nom de fichier en majuscule dans la balise et mettez le fichier PNG dans la racine, et liez au nom de fichier sans aucun chemin:

![Screenshot](screenshot.png)

5

Je ne fais qu'étendre ou ajouter un exemple à la réponse déjà acceptée.

Une fois que vous avez mis l'image sur votre dépôt Github.

Alors:

  • Ouvrez le dépôt Github correspondant sur votre navigateur.
  • Accédez au fichier image cible Ensuite, ouvrez simplement l'image dans un nouvel onglet. Ouverture de l'image dans un nouvel onglet
  • Copiez l'url Copiez l'url de l'onglet navigateur
  • Et enfin insérez l'URL au modèle suivant ![alt text](https://raw.githubusercontent.com/username/projectname/branch/path/to/img.png)

Sur mon cas c'est

![In a single picture](https://raw.githubusercontent.com/shadmazumder/Xcode/master/InOnePicture.png)

  • shadmazumder est mon username
  • Xcode est le projectname
  • master est le branch
  • InOnePicture.pngest le image, Sur mon cas InOnePicture.pngest dans le répertoire racine.

1
C'est le seul qui a parfaitement fonctionné pour moi. Aucune confusion sur les chemins, que "maître" se réfère à un répertoire ou à une branche, où se trouve le début de la racine, etc. pense.
Thomas Browne

5

Il y a 2 façons simples de le faire,

1) utilisez la balise HTML img,

2)! [] (Le chemin où votre image est enregistrée / image-name.png)

le chemin que vous pouvez copier à partir de l'URL dans le navigateur pendant que vous avez ouvert cette image. il peut y avoir un problème d'espacement, assurez-vous donc qu'il y a de l'espace en noir et blanc deux mots de chemin ou dans le nom de l'image ajoutez->% 20. tout comme le font les navigateurs.

Les deux fonctionneront, si vous voulez en savoir plus, vous pouvez consulter mon github -> https://github.com/adityarawat29


Cela a fonctionné pour moi. Avoir une image dans un dossier "apps" sous le fichier README.md que j'ai utilisé:![](images/ss_apps.png)
cdsaenz

1
Je suis surpris que seul Aditya ait mentionné que les espaces sont un problème, et d'une manière plutôt stupide aussi - pas d'erreurs, mais votre syntaxe est simplement affichée comme aucune telle fonctionnalité n'existerait même pas. Votez de ma part pour avoir mentionné cela.
Tammi

5

Cette réponse peut également être trouvée sur: https://github.com/YourUserAccount/YourProject/blob/master/DirectoryPath/ReadMe.md

Affichez les images du repo en utilisant:

pré-ajouter un domaine: https://raw.githubusercontent.com/

ajouter le drapeau: ?sanitize=true&raw=true

utilisation <img /> balise

Exemple d'url fonctionne pour svg, png et jpg en utilisant:
  • Domaine :raw.githubusercontent.com/
  • Nom d'utilisateur :YourUserAccount/
  • Repo :YourProject/
  • Succursale :YourBranch/
  • Chemin :DirectoryPath/
  • Nom de fichier :example.png

Fonctionne pour SVG, PNG et JPEG

 - `raw.githubusercontent.com/YourUserAccount/YourProject/YourBranch/DirectoryPath/svgdemo1.svg?sanitize=true&raw=true`

Exemple de code de travail affiché ci-dessous après utilisation:

**raw.githubusercontent.com**:
<img src="https://raw.githubusercontent.com/YourUserAccount/YourProject/master/DirectoryPath/Example.png?raw=true" />

<img src="https://raw.githubusercontent.com/YourUserAccount/YourProject/master/DirectoryPath/svgdemo1.svg?sanitize=true&raw=true" />

raw.githubusercontent.com :

Merci: - https://stackoverflow.com/a/48723190/1815624 - https://github.com/potherca-blog/StackOverflow/edit/master/question.13808020.include-an-svg-hosted-on-github -in-markdown / readme.md


Cela n'a pas fonctionné pour moi jusqu'à ce que j'aie supprimé la chaîne de requête.
mhenry1384

1
Au moins pour .png et raw.githubusercontent.com sanitize = true ne fonctionne pas et doit être supprimé. raw = true fonctionne très bien. github.com/sphinxy/AppDynamics.Playground/blob/master/README.md
Danila Polevshikov

1
rawgit.com a fermé ses portes en 2018 et ne devrait plus être utilisé; vous devez le supprimer de cette réponse. raw.githubusercontent.com , que vous mentionnez également, est l'alternative la plus proche.
Rory O'Kane

4

J'ai trouvé une autre solution mais assez différente et je vais l'expliquer

Fondamentalement, j'ai utilisé la balise pour afficher l'image, mais je voulais aller sur une autre page lorsque l'image a été cliquée et voici comment je l'ai fait.

<a href="the-url-you-want-to-go-when-image-is-clicked.com" />
<img src="image-source-url-location.com" />

Si vous le placez les uns à côté des autres, séparé par une nouvelle ligne, je suppose que lorsque vous cliquez sur l'image, il va à la balise qui a le href vers l'autre site que vous souhaitez rediriger.


2

DERNIER

Les wikis peuvent afficher des images PNG, JPEG ou GIF

Vous pouvez maintenant utiliser:

[[https://github.com/username/repository/blob/master/img/octocat.png|alt=octocat]]

-OU-

Suivez ces étapes:

  1. Sur GitHub, accédez à la page principale du référentiel.

  2. Sous le nom de votre référentiel, cliquez sur Wiki.

  3. À l'aide de la barre latérale du wiki, accédez à la page que vous souhaitez modifier, puis cliquez sur Modifier.

  4. Dans la barre d'outils du wiki, cliquez sur Image .

  5. Dans la boîte de dialogue "Insérer une image", saisissez l'URL de l'image et le texte de remplacement (utilisé par les moteurs de recherche et les lecteurs d'écran).
  6. Cliquez sur OK.

Référez Docs .


2

Pensez à utiliser un tablesi vous ajoutez plusieurs captures d'écran et souhaitez les aligner à l'aide de données tabulaires pour une meilleure accessibilité, comme indiqué ici:

thé

Si votre analyseur de démarques le prend en charge, vous pouvez également ajouter l' role="presentation"attribut WIA-ARIA à l'élément TABLE et omettre les thbalises.


2

Processus étape par étape, créez d'abord un dossier (nommez votre dossier) et ajoutez l'image / les images que vous souhaitez télécharger dans le fichier Lisezmoi.md. (vous pouvez également ajouter l'image / les images dans n'importe quel dossier existant de votre projet.) Maintenant, cliquez sur l'icône d'édition du fichier Lisezmoi.md, puis

![](relative url where images is located/refrence_image.png)  // refrence_image is the name of image in my case.

Après avoir ajouté une image, vous pouvez voir un aperçu des modifications dans l'onglet "Aperçu des modifications". Vous trouverez votre image ici. par exemple comme ça, dans mon cas,

![](app/src/main/res/drawable/refrence_image.png)

dossier d'application -> dossier src -> dossier principal -> dossier res -> dossier dessinable -> et à l'intérieur du dossier drawable fichier refrence_image.png se trouve. Pour ajouter plusieurs images, vous pouvez le faire comme ceci,

![](app/src/main/res/drawable/refrence_image1.png)
![](app/src/main/res/drawable/refrence_image2.png)
![](app/src/main/res/drawable/refrence_image3.png)

Remarque 1 - Assurez-vous que le nom de votre fichier image ne contient aucun espace. S'il contient des espaces, vous devez ajouter% 20 pour chaque espace entre le nom de fichier. Il vaut mieux supprimer les espaces.

Remarque 2 - vous pouvez même redimensionner l'image à l'aide de balises HTML, ou il existe d'autres façons. vous pouvez le rechercher sur Google. si tu en as besoin.

Après cela, écrivez votre message de modifications de validation, puis validez vos modifications.

Il existe de nombreux autres astuces pour le faire comme, créer un problème, etc., etc. De loin, c'est la meilleure méthode que j'ai rencontrée.


1

Nous pouvons le faire simplement,

  • créer un nouveau numéro sur GitHub
  • glisser-déposer des images sur le corps divdu problème

après quelques secondes, un lien sera généré. Maintenant, copiez le lien ou l'URL de l'image et utilisez-la sur n'importe quelle plate-forme prise en charge.


Votre solution fonctionne! C'est facile. Merci
Jeanne vie

1

Ajouter une image dans votre référentiel depuis l'option de téléchargement de fichier puis dans le fichier README

![Alt text]("enter repository image URL here") 

1

Il y a encore une autre option que je n'ai pas vue mentionnée. Vous pouvez simplement créer un autre référentiel sous votre utilisateur ou organisation appelé «actifs». Envoyez vos images à ce référentiel et référencez-les à partir de vos autres référentiels:

![alt text](https://raw.githubusercontent.com/my-org/assets/master/folder/logo.png)

Je l'ai fait dans l'un de mes repos et ça me va bien. Je peux version mes images README pour tous mes projets indépendamment de mon code, mais toujours les garder au même endroit . Aucun problème ou branche ou autre artefact facilement égaré requis.

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.