如何在README中居中显示图像。md文件在GitHub?

我一直在研究GitHub中使用的Markdown语法，但除了将图像大小调整为README的宽度。md页面，我不知道如何在它的中心图像。

这可能吗?如果有，我该怎么做?

当前回答

对于左对齐

 <img align="left" width="600" height="200" src="https://www.python.org/python-.png">

为了正确对齐

<img align="right" width="600" height="200" src="https://www.python.org/python-.png">

对于中心对齐

<p align="center">
  <img width="600" height="200" src="https://www.python.org/python-.png">
</p>

如果您觉得这有用，请在这里分叉以供将来参考。

其他回答

我为Github找到了一个解决方案，避免使用已弃用的对齐属性。它还避免了需要填充&nbsp。我制作了一个透明的1920x5 line.png，宽度="100%"，并将其作为每一列的最后一行。每一列之间的空间相等。

||
|:--:|
| <img width=200px src="image.png" alt="image alt text"> |
| <img width="100%" src="line.png"> |

这其实很简单。

-> This is centered Text <-

记住这一点，你可以把它应用到img语法中。

->![alt text](/link/to/img)<-

我们可以用下面的。请从Git文件夹中更改图像的src位置，如果图像未加载，请添加备用文本:

 <p align="center">
    <img src="your image URL here" alt="alternate text">
 </p>

如果修改图像对您来说不是问题，那么

如果您知道将显示减价的容器的大致宽度，以及

如果你的图像只在一个地方使用(例如只在GitHub中使用的README)，

然后你可以在图像编辑器中编辑你的图像，并在两边均匀地填充它。

在填充:

填充后:

原图(宽度= 250px):

填充图像(宽度= 660px):

您还可以将图像调整为所需的宽度和高度。例如:

<p align="center">
  <img src="https://anyserver.com/image.png" width="750px" height="300px"/></p>

为图像添加居中标题，只需多一行:

<p align="center">This is a centered caption for the image<p align="center">

幸运的是，这对README都有效。md和GitHub Wiki页面。

推荐文章