GitHub个人博客怎么加图片

fiy 其他 192

回复

共3条回复 我来回复
  • fiy的头像
    fiy
    Worktile&PingCode市场小伙伴
    评论

    在GitHub个人博客中添加图片可以通过以下步骤进行:

    1. 准备图片:首先,你需要准备好要添加的图片。可以是保存在本地的图片文件,也可以是在线图片的URL。

    2. 创建一个博客文章:进入你的GitHub个人博客仓库,点击创建新文件,给文件命名为 `your-blog-post.md`,后缀名可以是 `.md` 或 `.markdown`。

    3. 编写文章内容:使用Markdown语法编写文章内容,并在需要添加图片的位置插入相应的图片链接。

    4. 添加图片链接:插入本地图片时,需要先将图片上传到GitHub仓库中。在Markdown中插入图片的语法格式为:`![描述文字](图片链接)`。图片链接可以是相对路径(相对于博客文章文件所在的目录),也可以是绝对路径(完整的URL地址)。

    5. 上传本地图片:如果要添加本地图片,可以将图片文件拖拽到博客文章所在的目录中。然后可以使用相对路径来引用这些图片。

    6. 引用在线图片:如果要添加在线图片,可以直接在图片链接中输入图片的完整URL地址。

    7. 提交更改:完成文章内容的编写和图片链接的添加后,滚动到页面底部,填写提交信息,点击提交更改按钮。

    8. 查看博客:提交更改后,你的博客文章中应该显示出添加的图片。可以在GitHub个人博客的仓库中找到该文件,点击预览按钮查看最终效果。

    总结:通过以上步骤,你可以在GitHub个人博客中成功添加图片,为你的博客文章增添更丰富的内容。

    2年前 0条评论
  • 不及物动词的头像
    不及物动词
    这个人很懒,什么都没有留下~
    评论

    在GitHub个人博客上添加图片有以下几种方式:

    1. 使用Markdown语法:
    在你的博客文章中,可以使用Markdown语法来插入图片。首先,将图片上传到GitHub仓库中的某个目录下。然后,在文章中使用以下语法来插入图片:
    “`markdown
    ![图片描述](图片链接)
    “`
    其中,图片描述是显示在图片下方的文字,图片链接是图片在GitHub仓库中的相对路径。

    2. 使用HTML标签:
    如果你希望更灵活地控制图片的显示方式,可以使用HTML标签。首先,将图片上传到GitHub仓库中的某个目录下。然后,在文章中使用以下语法来插入图片:
    “`html
    图片描述
    “`
    其中,图片链接是图片在GitHub仓库中的相对路径,图片描述是显示在图片无法加载时的替代文本。

    3. 使用外部链接:
    如果你希望在博客中显示外部链接的图片,可以直接使用外部链接地址。在文章中使用以上两种方法中的任意一种语法,将图片链接替换为外部链接地址即可。

    4. 使用GitHub Pages的图片存储:
    GitHub Pages是GitHub提供的一个静态网页托管服务,你可以将图片上传到其中,然后在博客文章中添加图片链接。具体方法是在GitHub仓库中创建一个gh-pages分支,并将图片文件上传到该分支中的某个目录下。然后,在文章中使用以上两种方法中的任意一种语法,将图片链接指向gh-pages分支中的图片文件即可。

    5. 使用图床服务:
    如果你不想将图片上传到GitHub仓库中,还可以使用第三方图床服务。首先,将图片上传到图床服务提供的存储空间中,并获取图片链接。然后,在文章中使用以上两种方法中的任意一种语法,将图片链接替换为图床服务提供的链接即可。

    需要注意的是,无论使用哪种方法,都需要保证图片文件在GitHub仓库中是可访问的,并且要注意图片文件的大小。

    2年前 0条评论
  • worktile的头像
    worktile
    Worktile官方账号
    评论

    在GitHub个人博客中添加图片是一种丰富博客内容、增强可读性的重要方式。下面我会为你详细介绍在GitHub个人博客中加图片的方法与操作流程。

    ### 方法一:使用外部链接添加图片

    1. 首先,将你的图片上传至一个可公开访问的图床平台(如[Imgur](https://imgur.com/)、%5BGitHub%5D(https://github.com/))或云存储服务(如%5B七牛云存储%5D(https://www.qiniu.com/)、%5B阿里云OSS%5D(https://www.aliyun.com/product/oss)等),并获取图片的外部链接地址。

    2. 在你的博客文章中,通过Markdown语法使用外部链接插入图片。例如,在Markdown编辑器中输入以下代码:
    “`
    ![图片描述](图片链接地址)
    “`
    请将”图片描述”替换为你自己的描述,”图片链接地址”替换为你之前获取到的外部链接地址。

    3. 完成上述步骤后,保存博客文章,并在GitHub个人博客中查看效果。图片应该已经成功插入了博客文章中。

    ### 方法二:将图片存储在博客仓库中

    如果你希望将图片直接存储在博客的仓库中,可以采取以下步骤:

    1. 在你的博客仓库中创建一个文件夹,用于存放图片。你可以将文件夹的名称设为”images”或者其他你喜欢的名称。

    2. 将图片文件上传至刚刚创建的文件夹中。

    3. 在你的博客文章中,通过相对路径引用图片。例如,假设你的博客文章中要插入一张名为”example.jpg”的图片,你可以使用以下代码:
    “`
    ![图片描述](images/example.jpg)
    “`
    其中,”图片描述”是你自己的描述,”images/example.jpg”是你存放图片的相对路径。

    4. 在完成上述步骤后,保存博客文章,并在GitHub个人博客中查看效果。图片应该已经成功插入了博客文章中。

    注意事项:
    – 如果你通过方法二将图片存储在博客仓库中,那么每当你更改了仓库中的图片,博客文章中引用该图片的链接也需要相应更新。
    – 在使用方法一或方法二时,建议给图片添加适当的描述,以提高博客的可读性和辨识度。

    希望以上方法对你有所帮助!如果有任何疑问,请随时向我提问。

    2年前 0条评论
注册PingCode 在线客服
站长微信
站长微信
电话联系

400-800-1024

工作日9:30-21:00在线

分享本页
返回顶部