一、基本图片插入语法
在 Markdown 中,插入图片的基本语法是以感叹号!开头,然后紧跟用方括号[]包裹的替代文本,最后是在圆括号()内放置图片的路径(可以是本地路径或网络路径)。完整格式为:。
替代文本的作用是当图片无法正常显示时,展示给读者的描述性文字,同时也有助于屏幕阅读器等辅助工具向视障用户传达图片的大致内容。
例如,要插入一张来自网络的花朵图片,假设其网络地址为https://aeon.wiki/flower.jpg,可以这样写:![美丽的花朵]https://aeon.wiki/flower.jpg) 。在渲染后,如果图片加载正常,会显示出相应的花朵图片;若加载失败,则会显示 “美丽的花朵” 这段替代文本。
二、添加图片标题
许多 Markdown 解析器支持为插入的图片添加标题,方法是在图片路径之后添加用双引号、单引号或括号括起来的标题内容。语法格式为:。
比如: 。当鼠标悬停在渲染后的图片上时,部分 Markdown 渲染环境(如一些网页端的 Markdown 编辑器)会显示出 “夏日盛开的向日葵” 这个标题信息。
三、本地图片的插入
- 相对路径插入:如果图片与 Markdown 文件处于同一目录下,使用相对路径插入图片较为方便。例如,图片文件名为logo.png,在 Markdown 文件中插入该图片的语法就是 。
若图片位于 Markdown 文件所在目录的子文件夹中,假设子文件夹名为images,图片文件名为icon.jpg,则插入语法为 。
- 绝对路径插入:在 Windows 系统中,若图片位于C:\Users\username\Pictures\example.jpg,插入图片的语法是 ;在 macOS 或 Linux 系统中,比如图片路径是/home/user/images/pic.jpg,那么插入语法为 。
不过,使用绝对路径存在一定局限性,因为当文件移动位置或在不同设备上使用时,可能会导致路径错误,所以相对路径在大多数情况下更为常用。
四、关于图片尺寸调整
标准的 Markdown 语法本身并不直接支持设置图片的尺寸大小。然而,一些 Markdown 扩展(如 Markdown Extra 等)或特定的 Markdown 编辑器(如 Typora)提供了额外的功能来实现图片尺寸的调整。
- 使用 HTML 标签调整:一种常见的方法是借助 HTML 的<img>标签来设置图片的宽度和高度属性。例如,在 Markdown 文档中插入<img src=”图片路径” width=”400″ height=”300″> ,这样就可以显示一张宽度为 400 像素、高度为 300 像素的图片。比如<img src=”https://aeon.wiki/image.jpg” width=”400″ height=”300″> ,会按照指定尺寸显示相应的图片。
- 特定 Markdown 扩展语法:部分扩展可能有自己独特的语法来控制图片尺寸,但这需要所使用的 Markdown 解析器支持相应的扩展才行。
五、注意事项
- 确保图片路径的准确性,无论是网络路径还是本地路径,错误的路径会导致图片无法正常显示。
- 对于网络图片,要注意图片所在网站的使用条款,有些图片可能不允许被外部链接引用。
- 不同的 Markdown 解析器和渲染环境对语法的支持可能存在细微差异,在实际使用中可以根据具体情况进行调整和测试。
通过掌握以上 Markdown 图片语法,可以在 Markdown 文档中灵活地插入和处理图片,丰富文档的内容和表现力。