图片—Markdown极简入门教程(5)

时间:2022-07-22
本文章向大家介绍图片—Markdown极简入门教程(5),主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。

如果你知道如何在Markdown中创建链接,则也可以创建图像。语法几乎相同。

图像也有两种样式,就像链接一样,它们都以完全相同的方式呈现。链接和图像之间的区别在于,图像的开头带有感叹号(!)。

第一种图像样式称为嵌入式图像链接。要创建内嵌图像链接,请输入一个感叹号(!),将alt文本括在方括号([ ])中,然后将该链接括在括号中(( ))。(替代文字是描述视障者的图像的短语或句子。)

例如,要创建一个到https://octodex.github.com/images/bannekat.png的内嵌图像链接,并显示一个名为Benjamin Bannekat的替代文本,您可以在Markdown中编写该链接

![Benjamin Bannekat](https://octodex.github.com/images/bannekat.png)

在下面的框中,将链接转到图像,然后填写替代文本括号,以说出“漂亮的老虎”:

![漂亮的老虎](https://upload.wikimedia.org/wikipedia/commons/5/56/Tiger.50.jpg)

尽管您不需要添加替代文本,但它将使您的内容可供包括视障人士,使用屏幕阅读器或没有高速Internet连接的人群在内的受众访问。

对于参考图像,您将遵循与参考链接相同的模式。您将在Markdown之前加上一个感叹号,然后为alt文本提供两个括号,然后为image标签提供两个括号,如下所示:![The founding father][Father]在Markdown页面的底部,您将为标签定义一个图像,是这样的:[Father]: http://octodex.github.com/images/founding-father.jpg。

在下面的框中,我们已经开始放置一些参考图像。就像上一课一样,您需要完成它们。将第一个参考标签称为“黑色”,并使其链接到https://upload.wikimedia.org/wikipedia/commons/a/a3/81_INF_DIV_SSI.jpg;使第二个图片链接到http://icons.iconarchive.com/icons/google/noto-emoji-animals-nature/256/22221-cat-icon.png。

![黑猫][黑色]

![橘猫] [橘]

[黑色]:https://upload.wikimedia.org/wikipedia/commons/a/a3/81_INF_DIV_SSI.jpg

[橘]:http://icons.iconarchive.com/icons/google/noto-emoji-animals-nature/256/22221-cat-icon.png

你已经了解了在Markdown中添加图像的全部功能!