git 将图像添加到 GitHub 上的 README.md
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/14494747/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Add images to README.md on GitHub
提问by Midhun MP
Recently I joined GitHub. I hosted some projects there.
最近我加入了GitHub。我在那里主持了一些项目。
I need to include some images in my README File. I don't know how to do that.
我需要在我的自述文件中包含一些图像。我不知道该怎么做。
I searched about this, but all I got was some links which tell me to "host images on web and specify the image path in README.md file".
我搜索了这个,但我得到的只是一些链接,它们告诉我“在网络上托管图像并在 README.md 文件中指定图像路径”。
Is there any way to do this without hosting the images on any third-party web hosting services?
有没有办法在不将图像托管在任何第三方网络托管服务上的情况下做到这一点?
回答by captainclam
Try this markdown:
试试这个降价:

I think you can link directly to the raw version of an image if it's stored in your repository. i.e.
如果图像存储在您的存储库中,我认为您可以直接链接到图像的原始版本。IE

回答by resultsway
You can also use relative paths like
您还可以使用相对路径,如

回答by Ahmad Ajmi
- You can create a New Issue
- upload(drag & drop) images to it
- Copy the images URL and paste it into your README.md file.
- 您可以创建一个新问题
- 上传(拖放)图像到它
- 复制图像 URL 并将其粘贴到您的 README.md 文件中。
here is a detailed youTube video explained this in detail:
这是一个详细的 YouTube 视频,详细解释了这一点:
回答by Ahmad Ajmi
It's much simpler than that.
它比那简单得多。
Just upload your image to the repository root, and link to the filename without any path, like so:
只需将您的图像上传到存储库根目录,并链接到没有任何路径的文件名,如下所示:

回答by Evin1_
You can also add images with simple HTML tags:
您还可以添加带有简单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>
回答by paulmelnikow
Many of the posted solutions are incomplete or not to my taste.
许多已发布的解决方案不完整或不符合我的口味。
- An external CDN like imgur adds another tool to the chain. Meh.
- Creating a dummy issue in the issue tracker is a hack. It creates clutter and confuses users. It's a pain to migrate this solution to a fork, or off GitHub.
- Using the gh-pages branch makes the URLs brittle. Another person working on the project maintaining the gh-page may not know something external depends on the path to these images. The gh-pages branch has a particular behavior on GitHub which is not necessary for hosting CDN images.
- Tracking assets in version control is a good thing. As a project grows and changes it's a more sustainable way to manage and track changes by multiple users.
- If an image applies to a specific revision of the software, it may be preferable to link an immutable image. That way, if the image is later updated to reflect changes to the software, anyone reading that revision's readme will find the correct image.
- 像imgur这样的外部CDN向链中添加了另一个工具。嗯。
- 在问题跟踪器中创建虚拟问题是一种黑客行为。它会造成混乱并使用户感到困惑。将此解决方案迁移到 fork 或 GitHub 上很痛苦。
- 使用 gh-pages 分支会使 URL 变得脆弱。另一个维护 gh-page 项目的人可能不知道外部的东西,这取决于这些图像的路径。gh-pages 分支在 GitHub 上有一个特定的行为,这不是托管 CDN 图像所必需的。
- 在版本控制中跟踪资产是一件好事。随着项目的发展和变化,它是一种更可持续的方式来管理和跟踪多个用户的变化。
- 如果图像适用于软件的特定修订版,则最好链接不可变图像。这样,如果稍后更新图像以反映对软件的更改,任何阅读该修订版自述文件的人都会找到正确的图像。
My preferred solution, inspired by this gist, is to use an assets branchwith permalinks to specific revisions.
受此要点启发,我的首选解决方案是使用带有固定链接到特定修订版的资产分支。
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.
Construct a "permalink" to this revision of the image, and wrap it in Markdown.
为图像的此修订构建一个“永久链接”,并将其包装在 Markdown 中。
Looking up the commit SHA by hand is inconvenient, however, so as a shortcut press Y to a permalink to a file in a specific commit as this help.github page says.
手动查找提交 SHA 是不方便的,但是,作为一个快捷方式,按 Y 到特定提交中文件的永久链接,如此 help.github 页面所述。
To always show the latest image on the assets branch, use the blob URL:
要始终在资产分支上显示最新图像,请使用 blob URL:
https://github.com/github/{repository}/blob/assets/cat.png
(From the same GitHub help page File views show the latest version on a branch)
(来自同一个 GitHub 帮助页面文件视图显示分支上的最新版本)
回答by Darush
Commityour image (image.png) in a folder (myFolder) and add the following line in your README.md:
提交你的形象(image.png在一个文件夹()MyFolder文件),并添加下面一行在你README.md:


回答by abe312
- Create an issue regarding adding images
- Add the image by drag and drop or by file chooser
Then copy image source
Now add

to your README.md file
- 创建有关添加图像的问题
- 通过拖放或文件选择器添加图像
然后复制图片源
现在添加

到你的 README.md 文件
Done!
完毕!
Alternatively you can use some image hosting site like imgur
and get it's url and add it in your README.md file or you can use some static file hosting too.
或者,您可以使用一些图像托管站点,例如imgur
获取它的 url 并将其添加到您的 README.md 文件中,或者您也可以使用一些静态文件托管。
回答by B12Toaster
I need to include some images in my README File. I don't know how to do that.
我需要在我的自述文件中包含一些图像。我不知道该怎么做。
I created a small wizard that allows you to create and customize simple image galleries for your GitHub repository's readme: See ReadmeGalleryCreatorForGitHub.
我创建了一个小向导,允许您为 GitHub 存储库的自述文件创建和自定义简单的图像库:请参阅ReadmeGalleryCreatorForGitHub。
The wizard takes advantage of the fact that GitHub allows img tags to occur in the README.md
. Also, the wizard makes use of the popular trick of uploading images to GitHub by drag'n'dropping them in the issue area (as already mentioned in one of the answers in this thread).
该向导利用了 GitHub 允许 img 标签出现在README.md
. 此外,该向导通过将图像拖放到问题区域来利用将图像上传到 GitHub 的流行技巧(如本主题中的一个答案中所述)。
回答by rocketspacer
Just add an <img>
tag to your README.md with relative src to your repository. If you're not using relative src, make sure the server supports CORS.
只需<img>
在您的 README.md 中添加一个标签,并使用相对于您的存储库的 src。如果您不使用相对 src,请确保服务器支持 CORS。
It works because GitHub support inline-html
它有效是因为 GitHub 支持inline-html
<img src="/docs/logo.png" alt="My cool logo"/>
# My cool project and above is the logo of it
Observe here
在这里观察