是否可以在一个GitHub存储库的README文件中放置一个截图?语法是什么?
如果您使用Markdown (README.md):
如果你有图片在你的repo,你可以使用一个相对URL:
![Alt text](/relative/path/to/img.jpg?raw=true "Optional Title")
如果您需要嵌入托管在其他地方的图像,则可以使用完整的URL
![Alt text](http://full/path/to/img.jpg "Optional title")
GitHub建议使用带?raw=true参数的相对链接,以确保fork回购点正确。
raw=true参数的存在是为了确保你链接到的图像将会按原样呈现。这意味着只有图像将被链接,而不是相应文件的整个GitHub界面。更多细节请看这条评论。
请看一个例子:https://raw.github.com/altercation/solarized/master/README.md
如果你使用svg,那么你也需要将sanitize属性设置为true: ?raw=true&sanitize=true。(感谢@EliSherer)
另外,README文件中有关相对链接的文档:https://help.github.com/articles/relative-links-in-readmes
当然还有降价文档:http://daringfireball.net/projects/markdown/syntax
此外,如果您创建了一个新的分支屏幕截图来存储图像,您可以避免它们在主工作树中
然后你可以使用以下方法嵌入它们:
![Alt text](/../<branch name>/path/to/image.png?raw=true "Optional Title")
我发现在我的repo图像的路径是不够的,我必须链接到raw.github.com子域上的图像。
网址格式https://raw.github.com/{USERNAME}/{REPOSITORY}/{BRANCH}/{PATH}
降价示例![设置窗口](https://raw.github.com/ryanmaxwell/iArrived/master/Screenshots/Settings.png)
下面一行应该就是你要找的内容
如果文件在存储库中
![ScreenShot](https://raw.github.com/{username}/{repository}/{branch}/{path})
如果您的文件在其他外部url
![ScreenShot](https://{url})
使用位于/screen-shots目录中的图像。外部的<div>允许图像被定位。填充是使用<img width="desired-padding" height="0">实现的。
<div align="center">
<img width="45%" src="screen-shots/about.PNG" alt="About screen" title="About screen"</img>
<img height="0" width="8px">
<img width="45%" src="screen-shots/list.PNG" alt="List screen" title="List screen"></img>
</div>
尽管已经有了一个公认的答案,我想添加另一种方式来上传图片到GitHub上的自述。
你需要在你的回购中制造问题 拖放在评论区你的图像 图像链接生成后,将其插入到自述文件中
更多细节你可以在这里找到
用于显示图像的markdown语法确实是:
![image](https://{url})
但是:如何提供url ?
你可能不想用截图把你的回购弄得乱七八糟,它们和代码没有任何关系 你可能不想处理把你的图片放到网上的麻烦。(上传到服务器…).
所以…你可以使用这个很棒的技巧让github托管你的图像文件。TDLR:
在回购的问题列表上创建一个问题 在这个问题上拖放你的截图 复制标记代码,github刚刚为你创建显示你的图像 将其粘贴到您的自述文件(或任何您想要的地方)
http://solutionoptimist.com/2013/12/28/awesome-github-tricks/
Markdown: !黑“更加铝(http://url/to/img.png)
创建一个关于添加图像的问题 通过拖放或文件选择器添加图像 然后复制图像源 现在添加![截图](http://url/to/img.png)到您的README。md文件
完成了!
或者,你也可以使用一些图像托管网站,如imgur,并获得它的url,并将其添加到你的README。Md文件或者你也可以使用一些静态文件托管。
样品的问题
对我来说,最好的办法是
用github上的存储库创建一个新问题,然后以gif格式上传文件。要将视频文件转换为gif格式,您可以使用这个网站http://www.online-convert.com/ 提交新创建的问题。 复制上传文件的地址 最后在你的README文件中放入!
希望这能有所帮助。
方法1->降价方式
![Alt Text](https://raw.github.com/{USERNAME}/{REPOSITORY}/{BRANCH}/{PATH})
方法2->HTML方式
<img src="https://link(format same as above)" width="100" height="100"/>
or
<img src="https://link" style=" width:100px ; height:100px " />
如果你不想样式你的图像,即调整大小,删除样式部分
将此添加到README
<div align="center">
<img src="/screenshots/screen1.jpg" width="400px"</img>
</div>
首先,在本地repo的根目录下创建一个目录(文件夹),其中将包含您想要添加的屏幕截图。让我们把这个目录的名称称为屏幕截图。将你想要添加的图片(JPEG、PNG、GIF等)放到这个目录中。
Android Studio工作空间截图
其次,您需要将每个图像的链接添加到README中。所以,如果我的截图目录中有命名为1_ArtistsActivity.png和2_AlbumsActivity.png的图像,我将像这样添加它们的链接:
<img src="screenshots/1_ArtistsActivity.png" height="400" alt="Screenshot"/> <img src=“screenshots/2_AlbumsActivity.png" height="400" alt="Screenshot"/>
如果你想让每个截图在单独的行上,把它们的链接写在单独的行上。但是,最好将所有链接写在一行中,仅用空格分隔。它可能看起来不太好,但通过这样做,GitHub会自动为你安排它们。
最后,提交您的更改并发布它!
我在谷歌上搜索了一些类似的问题,没有看到任何关于我的问题的答案,而且它非常简单/容易解决。
云存储——在readme中处理图像的方法略有不同
就像OP一样,我想在我的Github README中有一张图像,并且,知道这样做的Markdown语法,输入它:
![My Image](https://storage.cloud.google.com/${MY_BUCKET}/${MY_IMAGE}
您需要完成上面的实际替换(例如MY_IMAGE=image.jpg)才能使其工作。
但是,等待…失败——没有实际渲染的照片!和链接是完全由谷歌存储!
Github迷彩-匿名图像
Github匿名托管你的图片,耶!但是,这就为谷歌存储资产带来了一个问题。您需要从谷歌云控制台获取生成的url。
我相信有一个更流畅的方法,但是,只需访问您给定的URL端点并复制长URL。细节:
指令
访问您的存储控制台:https://console.cloud.google.com/storage/browser/${MY_BUCKET}?project=${MY_PROJECT} 点击你想要在Github中显示的图像(这会弹出“对象详细信息”页面) 复制pasta的URL(以https开始,而不是gs)到一个新的浏览器选项卡/窗口 复制pasta新生成的URL -它应该更长-从你的新浏览器选项卡/窗口到你的Github README文件
希望这有助于加快和澄清这个问题的其他人。
[截图](截图.png)就像上面提到的那样。将截图.png替换为您在存储库中上传的图像的名称。
但当你上传图片时,这里有一个新手提示(我自己也犯了这个错误):
确保映像名称不包含空格。我的原始图片被保存为“截图日月年id.png”。如果您不将名称更改为类似contenttofimage .png的名称,那么它将不会作为图像出现在自述文件中。
从2021年3月起,现在支持:
将文件附加到标记文件
You can now attach files, including images, to markdown files while you're editing them in the web. This works just like file attachments in issues and pull requests and supports the same file types. Just drag and drag, click and select, or paste. Note: If you add an image to a markdown file, anyone can view the anonymized image URL without authentication, even if the markdown file is in a private repository. To keep images private, serve them from a private network or server that requires authentication. For more information on anonymized URLs see "About anonymized image URLs".
对我来说,相对路径非常有效。
我是怎么做到的: 在我当前的md文件中,我想使用来自另一个目录的图片,我使用了这样的相对路径-考虑以下点。
Md文件loc: base dir -> _post -> current_file.md
&图片文件loc,我想使用:基础dir -> _asset -> picture_to_use.jpeg
我使用的语句是在current_file上。md文件:
![your-pic-caption-name](../_asset/picture_to_use.jpeg)
注意-在此之前,我使用的是direct _asset,但理想情况下,它从../_asset/and-so-no开始
参考资料- https://docs.github.com/en/github/creating-cloning-and-archiving-repositories/creating-a-repository-on-github/about-readmes
请休息这四步, 这对我很有效
1-在GitHub上创建一个新问题。 拖放图片到评论栏或上传照片。 3 .等待上传完成。 4 .复制URL并在GitHub上的Markdown文件中使用它(在存储库的自述中使用生成的URL)。
我的图像在名称中有空格,例如,粘贴图像20221006123035.png,这导致了我的问题,我失去了一些时间来修复它。如果有人有同样的问题,那么下面是步骤
我通过上传选项上传了图像 然后在网站的文件浏览UI中点击图片。 图像在浏览器中打开。从浏览器的URL复制图像的URL。您可以复制整个路径,或相对于您的.md文件 现在像这样插入。md文件的链接![概述](粘贴%20image%2020221006123035.png)
推荐文章
- 使用pandoc从Markdown转换为PDF时设置空白大小
- 如何修复Github页面上的HTTP 404 ?
- 如何显示数学方程在一般github的markdown(不是github的博客)
- 无法推送到远程分支,无法解析到分支
- 使用Markdown的Sphinx而不是reST
- 如何在GitHub上创建自己的存储库?
- Github“更新被拒绝,因为远程包含您在本地没有的工作。”
- 降价和图像对齐
- 如何在不同的用户名下推送到GitHub ?
- 在最初创建提交的GitHub上找到一个Pull Request
- Git凭据助手-更新密码
- 标签和释放的区别是什么?
- 切换到另一个Git标记
- Heroku和GitHub:“项目无法检索,内部服务器错误”
- 将现有项目推到Github