比这简单得多。

Question

最近我加入了 GitHub 。我在那里举办了一些项目。

我需要在README文件中包含一些图像。我不知道该怎么做。

我搜索了这个，但我得到的只是一些链接告诉我“在网络上托管图像并在README.md文件中指定图像路径”。

如果没有在任何第三方网络托管服务上托管图片，有没有办法做到这一点？

Answer 1

尝试此降价：

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

如果图像存储在您的存储库中，我认为您可以直接链接到图像的原始版本。即。

![alt text](https://raw.githubusercontent.com/username/projectname/branch/path/to/img.png)

修改：注意到评论链接到建议使用gh-pages的文章。此外，相对链接可能比我上面发布的绝对URL更好。

Answer 2

您还可以使用相对路径，例如

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

Answer 3

您可以创建新问题
上传（拖放）图片
复制图片网址并将其粘贴到您的README.md文件中。

这是一个详细的youTube视频详细解释了这个：

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

Answer 4

比这简单得多。

只需将您的图像上传到存储库根目录，然后链接到没有任何路径的文件名，如下所示：

![Screenshot](screenshot.png)

Answer 5

您还可以使用简单的 HTML标记：

添加图片

CSS

Answer 6

许多发布的解决方案都不完整或不符合我的口味。

像imgur这样的外部CDN为链条添加了另一个工具。 MEH。
在问题跟踪器中创建虚拟问题是一个黑客攻击。它会造成混乱并使用户感到困惑。将此解决方案迁移到fork或关闭GitHub是一件痛苦的事。
使用gh-pages分支使URL变得脆弱。另一个从事项目维护gh页面的人可能不知道外部的东西取决于这些图像的路径。 gh-pages分支在GitHub上具有特定的行为，这对于托管CDN图像不是必需的。
在版本控制中跟踪资产是一件好事。随着项目的发展和变化，这是一种更可持续的方式来管理和跟踪多个用户的变化。
如果图像适用于软件的特定版本，则最好链接不可变图像。这样，如果稍后更新图像以反映软件的更改，那么阅读该修订版自述文件的任何人都将找到正确的图像。

我的首选解决方案受this gist启发，使用资产分支，永久链接到特定修订。

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 needed below.

构建此图像修订版的“永久链接”，并将其包装在Markdown中：

![Cat](https://raw.githubusercontent.com/{user}/{repo}/{sha}/cat.png)

e.g。

![Cat](https://raw.githubusercontent.com/paulmelnikow/zsh-startup-timer/3923c60fc66d4223ccf063d169ccf2ff167b1270/cat.png)

要始终在资产分支上显示最新图像，请使用assets代替sha：

![Cat](https://raw.githubusercontent.com/{user}/{repo}/assets/cat.png)

Answer 7

提交您的图片（ image.png ）在文件夹（ myFolder ）中，并在自述文件中添加以下行。 md ：

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

Answer 8

创建有关添加图片的问题
通过拖放或文件选择器添加图像
然后复制图像源
现在将![alt tag](http://url/to/img.png)添加到您的README.md文件中

完成！

或者你可以使用像imgur这样的图像托管网站并获取它的URL并将其添加到README.md文件中，或者也可以使用一些静态文件托管。

Sample issue

Answer 9

基本语法

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

这里：

my-image-alt-tag：如果未显示图片，将显示的文字。
url-to-image：无论您的图像资源是什么。图像的URI

实施例

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

这将如下所示：

Answer 10

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.

It works because GitHub support inline-html

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

Observe here

Answer 11

在新的Github用户界面中，这对我有效-

示例-将image.png提交到文件夹（myFolder）中，并将以下行添加到README.md中：

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

Answer 12

我需要在README文件中包含一些图像。我不知道该怎么做那样做。

我创建了一个小向导，允许您为GitHub存储库的自述文件创建和自定义简单的图像库：请参阅ReadmeGalleryCreatorForGitHub。

该向导利用了GitHub允许img标记出现在README.md中的事实。此外，该向导利用了将图像上传到GitHub的流行技巧，方法是将它们拖放到问题区域（如本主题中的一个答案中所述）。

Answer 13

分步进行，首先创建一个文件夹（将文件夹命名为），然后将要上传的一个或多个图像添加到Readme.md文件中。（您还可以将图像添加到项目的任何现有文件夹中。）现在，单击Readme.md文件的编辑图标，然后

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

添加图像后，您可以在“预览更改”选项卡中看到更改的预览。您可以在此处找到您的图像。例如这样就我而言，

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

app文件夹-> src文件夹->主文件夹-> res文件夹-> drawable文件夹->并在内部drawable文件夹中找到refrence_image.png文件。要添加多张图片，您可以这样做，

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

注1-确保图像文件名不包含任何空格。如果它包含空格，那么您需要为文件名之间的每个空格添加％20。最好删除空格。

注2-您甚至可以使用HTML标签来调整图像的大小，或者还有其他方法。您可以在Google上搜索更多内容。如果需要的话。

此后，写下您的提交更改消息，然后提交更改。

还有很多类似的方法，例如创建问题等等，到目前为止，这是我遇到的最好的方法。

Answer 14

在我的情况下，我使用imgur并以这种方式使用直接链接。

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

Answer 15

我已经解决了这个问题。您只需要引用其他人的自述文件。

首先，您应该将图像文件上传到github代码库！然后直接引用图像文件的地址。

Answer 16

您可以使用替代github CDN链接从README.md（或外部）链接到项目中的图像。

网址如下所示：

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

我的项目中有一个SVG图像，当我在我的Python项目文档中引用它时，它不会呈现。

项目链接

以下是文件的项目链接（不呈现为图像）：

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

嵌入式图片示例：

原始链接

以下是文件的RAW链接（仍未呈现为图像）：

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

嵌入式图片示例：

CDN链接

使用CDN链接，我可以使用（渲染为图像）链接到该文件：

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

嵌入式图片示例：

这就是我能够在我的README.md文件和我的PyPi项目中使用我的项目中的图像reStructredText doucmentation（here）

Answer 17

我通常在网站上托管图片，这可以链接到任何托管图片。只是在自述文件中抛出这个。适用于.rst个文件，不确定.md

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

Answer 18

你可以使用

![A test image](image.png)

其中 ![A test image] 是您的替代文字，而 (image.png) 是您图片的链接。

您可以将图像放在云服务或其他在线图像托管平台上或者您可以提供来自存储库的图像链接（如果它在存储库中）

您还可以在存储库中创建一个专门用于自述文件的特定文件夹

Answer 19

在我的情况下，我想在Github上显示打印屏幕，但也在NPM上显示。即使使用相对路径在Github内工作，它也不会在它之外工作。基本上，即使我将项目推送到NPM（它只使用相同的readme.md，图像也从未显示过。

我尝试了几种方法，最后这对我有用：

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

我现在可以在NPM或我可以发布我的包裹的任何其他地方正确地看到我的图像。

Answer 20

您可以这样做：

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

然后，您可以像这样在README文件中引用它：

![diagram](diagram.png)

Answer 21

这就是工作原理！

小心标记中的文件名大写，并将PNG文件放在根目录下，并链接到文件名而无需任何路径：

![Screenshot](screenshot.png)

Answer 22

如果你需要上传一些图片用于文档，一个很好的方法是使用git-lfs。假设你已经安装了git-lfs，请按照以下步骤操作：

为每种图像类型初始化git lfs：

git lfs *.png
git lfs *.svg
git lfs *.gif
git lfs *.jpg
git lfs *.jpeg

创建一个将用作图像位置的文件夹，例如。 doc。在基于GNU / Linux和Unix的系统上，可以通过以下方式完成：
```
cd project_folder
mkdir doc
git add doc
```
将所有图像粘贴到doc文件夹中。然后通过git add命令添加它们。
提交并推送。
图片公开在以下网址中：
回复中的
https://media.githubusercontent.com/media/ ^ github_username ^ / ^ repo ^ / ^ branch ^ / ^ image_location

其中： * ^github_username^是github中的用户名（您可以在个人资料页面中找到它） * ^repo_name^是存储库名称 * ^branch^是上传图像的存储库分支 * ^image_location in the repo^是包含图像存储文件夹的位置。

此外，您可以先上传图片，然后访问项目github页面中的位置并浏览直到找到图像，然后按下download按钮，然后从浏览器中复制粘贴网址。地址栏。

从我的项目中查看this作为参考。

然后您可以使用网址使用上面提到的降价语法来包含它们：

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

例如：我们假设我们使用this photo然后您可以使用降价语法：

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

Answer 23

我只是在已经接受的答案中扩展或添加示例。

将图片放到Github存储库中。

然后：

在浏览器中打开相应的Github存储库。
导航到目标图像文件，然后在新选项卡中打开图像。
复制网址
最后将网址插入以下模式![alt text](https://raw.githubusercontent.com/username/projectname/branch/path/to/img.png)

我的情况是

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

哪里

shadmazumder是我的username
Xcode是projectname
master是branch
InOnePicture.png是image，就我而言，InOnePicture.png在根目录中。

Answer 24

使用桌子脱颖而出，它将赋予它独特的魅力

表语法为：

用符号|分隔每个列单元格

，表头（第一行）乘第二行，---

|第1列|第2列|
| ---------------- | ------------- |
|图片1 |图片2 |

输出

如果您要使用两张图片，现在只需将<img src="url/relativePath">放在图片1和图片2

注意：如果使用多张图像仅包含更多列，则可以使用width和height属性使其更具可读性

示例

|第1列|第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"> |

间距无关紧要

输出图像

受帮助：adam-p

Answer 25

您现在可以在编辑自述文件时拖放图像。

Github 将为您创建一个链接，格式为：

https://user-images.githubusercontent.com/******/********.file_format

或者，在文件底部，它会显示“通过拖放、选择或粘贴来附加文件”。如果你点击那个，它会给你一个直接上传文件的选项，或者你可以直接粘贴它！

Answer 26

也可以在以下位置找到此答案： https://github.com/YourUserAccount/YourProject/blob/master/DirectoryPath/ReadMe.md

使用以下命令显示来自回购的图像：

前缀域：https://raw.githubusercontent.com/或https://cdn.rawgit.com/

附加标志： `?sanitize=true&raw=true`

使用`<img />`标签

示例网址适用于svg，png和jpg，方法是：

域：raw.githubusercontent.com/
用户名：YourUserAccount/
回购：YourProject/
分支机构：YourBranch/
路径：DirectoryPath/
文件名：example.png

适用于SVG，PNG和JPEG

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

使用后在下面显示的工作示例代码：

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

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

**https://cdn.rawgit.com**:
<img src="https://cdn.rawgit.com/YourUserAccount/YourProject/master/DirectoryPath/Example.png" />

<img src="https://cdn.rawgit.com/YourUserAccount/YourProject/master/DirectoryPath/svgdemo1.svg" />

raw.githubusercontent.com ：

https://cdn.rawgit.com ：

谢谢： -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

Answer 27

我还没有提到另一个选择。您可以简单地在您的用户或组织下创建另一个称为“资产”的存储库。将您的图像推送到此存储库，并从其他存储库中引用它们：

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

我已经在我的repos之一中做到了，很适合我。我可以独立于代码对所有项目的README映像进行版本控制，但仍将它们全部放在一个place中。不需要任何问题，分支或其他容易放错位置的工件。

Answer 28

从上传文件选项在存储库中添加图像，然后在自述文件中添加图像

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

Answer 29

在GitHub上将图像添加到README.md

35 个答案:

比这简单得多。

基本语法

这里：

实施例

这将如下所示：

项目链接

原始链接

CDN链接

使用以下命令显示来自回购的图像：

前缀域：https://raw.githubusercontent.com/或https://cdn.rawgit.com/

附加标志： `?sanitize=true&raw=true`

使用`<img />`标签

最新

在GitHub上将图像添加到README.md

35 个答案:

比这简单得多。

基本语法

这里：

实施例

这将如下所示：

项目链接

原始链接

CDN链接

使用以下命令显示来自回购的图像：

前缀域：https://raw.githubusercontent.com/或https://cdn.rawgit.com/

附加标志： ?sanitize=true&raw=true

使用<img />标签

最新

附加标志： `?sanitize=true&raw=true`

使用`<img />`标签