GFM

图片

图片的语法类似于链接的语法，但有一点不同。这里使用一个图像描述，而不是链接文本。 这个规则与链接文本相同，除了（a）图像描述以 ![ 开头而不是 [ ，和（b）图像描述可能包含链接。图像描述有内联元素作为其内容。 当图像渲染为 HTML 时，用作图像的 alt 属性。

示例 580

Markdown HTML 效果
 
![foo](/url "title")


<p><img src="/url" alt="foo" title="title" /></p>

示例 581

Markdown HTML 效果
 
![foo *bar*]

[foo *bar*]: train.jpg "train & tracks"


<p><img src="train.jpg" alt="foo bar" title="train &amp; tracks" /></p>

示例 582

Markdown HTML 效果
 
![foo ![bar](/url)](/url2)


<p><img src="/url2" alt="foo bar" /></p>

示例 583

Markdown HTML 效果
 
![foo [bar](/url)](/url2)


<p><img src="/url2" alt="foo bar" /></p>

虽然此规范涉及解析而非渲染，但建议在渲染到 HTML 时，仅使用图像描述的纯字符串内容。请注意，在上面的示例中，alt 属性的值是foo bar，而不是foo [bar](/url)或foo <a href="/url">bar</a>。 仅渲染纯字符串内容，而不进行格式化。

示例 584

Markdown HTML 效果
 
![foo *bar*][]

[foo *bar*]: train.jpg "train & tracks"


<p><img src="train.jpg" alt="foo bar" title="train &amp; tracks" /></p>

示例 585

Markdown HTML 效果
 
![foo *bar*][foobar]

[FOOBAR]: train.jpg "train & tracks"


<p><img src="train.jpg" alt="foo bar" title="train &amp; tracks" /></p>

示例 586

Markdown HTML 效果
 
![foo](train.jpg)


<p><img src="train.jpg" alt="foo" /></p>

示例 587

Markdown HTML 效果
 
My ![foo bar](/path/to/train.jpg  "title"   )


<p>My <img src="/path/to/train.jpg" alt="foo bar" title="title" /></p>

示例 588

Markdown HTML 效果
 
![foo](<url>)


<p><img src="url" alt="foo" /></p>

示例 589

Markdown HTML 效果
 
![](/url)


<p><img src="/url" alt="" /></p>

引用类型：

示例 590

Markdown HTML 效果
 
![foo][bar]

[bar]: /url


<p><img src="/url" alt="foo" /></p>

示例 591

Markdown HTML 效果
 
![foo][bar]

[BAR]: /url


<p><img src="/url" alt="foo" /></p>

折叠类型：

示例 592

Markdown HTML 效果
 
![foo][]

[foo]: /url "title"


<p><img src="/url" alt="foo" title="title" /></p>

示例 593

Markdown HTML 效果
 
![*foo* bar][]

[*foo* bar]: /url "title"


<p><img src="/url" alt="foo bar" title="title" /></p>

标签不区分大小写：

示例 594

Markdown HTML 效果
 
![Foo][]

[foo]: /url "title"


<p><img src="/url" alt="Foo" title="title" /></p>

与引用链接一样，两组括号之间不允许有空格：

示例 595

Markdown HTML 效果
 
![foo] 
[]

[foo]: /url "title"


<p><img src="/url" alt="foo" title="title" />
[]</p>

快捷类型:

示例 596

Markdown HTML 效果
 
![foo]

[foo]: /url "title"


<p><img src="/url" alt="foo" title="title" /></p>

示例 597

Markdown HTML 效果
 
![*foo* bar]

[*foo* bar]: /url "title"


<p><img src="/url" alt="foo bar" title="title" /></p>

注意，链接标签不能包含未转义的括号：

示例 598

Markdown HTML 效果
 
![[foo]]

[[foo]]: /url "title"


<p>![[foo]]</p>
<p>[[foo]]: /url &quot;title&quot;</p>

链接标签不区分大小写：

示例 599

Markdown HTML 效果
 
![Foo]

[foo]: /url "title"


<p><img src="/url" alt="Foo" title="title" /></p>

如果你只想要字符!后跟括号内的文字，你可以反斜杠来转义开头的[：

示例 600

Markdown HTML 效果
 
!\[foo]

[foo]: /url "title"


<p>![foo]</p>

如果你想要在!后跟一个链接，那么就转义!：

示例 601

Markdown HTML 效果
 
\![foo]

[foo]: /url "title"


<p>!<a href="/url" title="title">foo</a></p>