是否可以在 GitHub markdown 中为图像添加边框？

Question

我需要为 GitHub README.md 文件中的图像添加边框。这是应该如何嵌入图像：

![GitHub Logo](/images/logo.png)

我试过用 table:

包装图像

|--------------------------------|
|![GitHub Logo](/images/logo.png)|

但没有 header 就无法创建 table。

我也尝试过将图片作为 html 标签包含在内：

<img src="/images/logo.png" style="border: 1px solid black" />

但没有成功。有什么办法吗？

Answer 1

它很老套，并不总是很漂亮，但是用 <kbd> 标签围绕图像。

之前

<img src="https://i.stack.imgur.com/CtiyS.png">

之后

<kbd>
  <img src="https://i.stack.imgur.com/CtiyS.png">
</kbd>

它呈现如下：

围绕 markdown 图像语法可能不适用于某些 markdown 实现。 如果以下内容不起作用

<kbd>![alt-text](https://example.com/image.png)</kbd>

尝试将图像作为 HTML <img> 标签嵌入

<kbd><img src="https://example.com/image.png" /></kbd>

Answer 2

您可以使用 <table> 标签创建没有 header 的表。

<table><tr><td>
    <img src="/images/logo.png" />
</td></tr></table>

Answer 3

在 StackExchange 网站上，我喜欢为此目的使用 "quote" 标记 >。

例如：

> [![screenshot][1]][1]

  [1]: https://i.stack.imgur.com/CtiyS.png

呈现如下：

Answer 4

另一种方法是在图像编辑工具中自己提供边框并上传。

Answer 5

另一种方法是使用 table 的第一个单元格。

代码：

|![pictureAliasName](pathOfPicture/pictureName.png)|
-

- 字符在代码中很重要。

你可以看到结果here .

Answer 6

我在 Gitlab 上这样做的方式是使用 table 像这样：

| ![Alt name of image](/path-to-image.png) |
| ------ |

Answer 7

我经常在 GitHub 评论中这样做。也许需要一些换行符。

# Added at 2021/05/24

// No end tag
<kbd> ![image_alt](image_path)

# Added at 2020/09/14

| ![...)
|-

label_text
|-
![...)

| ![...a) | ![...b)| ![...c)
|-|-|-

# Before / After

Before | After
-|-
![...a) | ![...b)

# with Background color

||
|-
||
![...)

是否可以在 GitHub markdown 中为图像添加边框？

Is it possible to add border to image in GitHub markdown?

html

github

markdown

之前

之后