有没有办法将GIF添加到Markdown文件?

Zay*_*iwa 184 markdown gif github-flavored-markdown

我想将这个gif添加到GitHub风格的markdown文件中.如果无法在GitHub中完成,是否可以在另一个版本的markdown中执行此操作?

Kha*_*jar 406

显示GIF需要两件事

1-在这些示例中使用此语法

![Alt Text](https://media.giphy.com/media/vFKqnCdLPNOKc/giphy.gif)

产量:

替代文字

2-图像网址必须以gif结尾

3-对于后人:如果上面的.gif链接变坏,你将看不到图像,而是看到alt文本和URL,如下所示:

替代文字

4-用于调整gif的大小,您可以使用此语法,如此Github教程链接中所示

<img src="https://media.giphy.com/media/vFKqnCdLPNOKc/giphy.gif" width="40" height="40" />
Run Code Online (Sandbox Code Playgroud)

产量:

  • 因为gif很有趣而赞成 (114认同)
  • downvoted,因为gif令人沮丧 (11认同)
  • 那个孩子真的很难受.在瓷砖地板上的方式太硬,很可能受到脑损伤或至少是严重的脑震荡.事实上,我打算删除它,因为我认为它令人反感,并用更好的东西取而代之. (5认同)
  • @NikKov真实!! 这是一个技术问题. (3认同)
  • 就这样,这只猫成为了全球最受欢迎的占位符 gif (3认同)
  • 请注意,如果您的gif太大,则会看到错误的图像框。较小的gif效果很好。 (2认同)
  • @加蒂我不知道。我认为您需要为此提出一个新问题。 (2认同)
  • @jibeeeee 感谢“Rick 支持 Monica”用户。他是添加猫图像的人 (2认同)

eri*_*rip 98

Markdown Cheatsheet:

您可以将其添加到您的仓库并使用图片标记引用它:

Inline-style: 
![alt text](https://github.com/adam-p/markdown-here/raw/master/src/common/images/icon48.png "Logo Title Text 1")

Reference-style: 
![alt text][logo]

[logo]: https://github.com/adam-p/markdown-here/raw/master/src/common/images/icon48.png "Logo Title Text 2"
Run Code Online (Sandbox Code Playgroud)

内嵌式: 替代文字

参考样式: 替代文字


或者,您可以直接使用网址:

![](http://www.reactiongifs.us/wp-content/uploads/2013/10/nuh_uh_conan_obrien.gif)
Run Code Online (Sandbox Code Playgroud)


小智 14

只需将.gif文件上传到 GitHub 的基本文件夹并编辑README.md只需使用此代码

![](name-of-giphy.gif)


San*_*nam 10

另一种更简单的方法是在浏览器(chrome)中打开 git 存储库,单击编辑 README.md

然后只需从本地计算机磁盘拖放 gif/png/jpeg 文件,文件就会自动上传,链接将放置在 README.md 文件中,如下所示

![myfile](https://user-images.githubusercontent.com/52455330/139071980-91302a8a-37b1-4196-803e-f91b1de2ee5b.gif)
Run Code Online (Sandbox Code Playgroud)

我的文件

您要添加的文件

我的文件

![myfile](https://www.reactiongifs.us/wp-content/uploads/2013/10/nuh_uh_conan_obrien.gif)
Run Code Online (Sandbox Code Playgroud)


Sum*_*mit 8

从本地上传:

  1. 将您的 .gif 文件添加到 Github 存储库的根目录并推送更改。
  2. 转到 README.md
  3. 添加这个 ![Alt text](name-of-gif-file.gif) / ![](name-of-gif-file.gif)
  4. 应该看到提交和gif。

使用 url 显示 gif:

  1. 转到 README.md
  2. 以这种格式添加 ![Alt text](https://sample/url/name-of-gif-file.gif)
  3. 应该看到提交和gif。

希望这可以帮助。


Jor*_*sen 5

吉菲·格查(Giphy Gotcha)

遵循上面列出的2个要求(必须结束.gif并使用图像语法)之后,如果您对giphy的gif遇到麻烦:

确保您具有正确的Giphy网址!您不能只添加.gif到这一部分的末尾并使其起作用。

如果只是从浏览器复制URL,则会得到类似以下内容的信息:

https://giphy.com/gifs/gol-automaton-game-of-life-QfsvYoBSSpfbtFJIVo

您需要单击“复制链接”,然后专门抓取“ GIF链接”。注意正确的一点,media.giphy.com而不只是giphy.com

https://media.giphy.com/media/QfsvYoBSSpfbtFJIVo/giphy.gif


Win*_*han 5

  1. 有gif文件。
  2. 将gif文件推送到您的github存储库
  3. 单击github存储库上的文件以获取gif的github地址
  4. 在您的自述文件中: ![alt-text](link)

下面的例子: ![grab-landing-page](https://github.com/winnie1312/grab/blob/master/grab-landingpage-winnie.gif)

  • 将它放在`/ img`这样的repo目录中然后使用`![alt text](img / my-image.png)更容易。 (3认同)

Mah*_*zad 5

如果您可以提供 SVG 格式的图像(它是一个图标而不是照片),则可以使用 SVG SMIL动画对其进行动画处理,并且 SVG 绝对是 GIF 图像(甚至其他格式)的最佳替代品。

SVG 与其他图像格式一样,可以与标准标记或 HTML 元素一起使用<img>

![image description](path/in/repository/to/image.svg)
Run Code Online (Sandbox Code Playgroud)
<img src="path/in/repository/to/image.svg" width="128"/>
Run Code Online (Sandbox Code Playgroud)


Nju*_*_nc 5

使用 HTML 的img标签,然后给出源 url。

<img src="https://...thumbs-up.gif">
Run Code Online (Sandbox Code Playgroud)

在此输入图像描述