我一直在研究GitHub中使用的Markdown语法,但除了将图像大小调整为README的宽度。md页面,我不知道如何在它的中心图像。
这可能吗?如果有,我该怎么做?
我一直在研究GitHub中使用的Markdown语法,但除了将图像大小调整为README的宽度。md页面,我不知道如何在它的中心图像。
这可能吗?如果有,我该怎么做?
当前回答
只要去Readme。Md文件并使用此代码。
<div align="center">
<img src=https://newfastuff.com/wp-content/uploads/2019/05/bW7QXVB.png" >
<p>Perfectly balanced</p>
</div>
<div align= " center " >[你的内容在这里]</div>适合页面中的所有内容,并根据页面的尺寸将其居中对齐。
其他回答
我为Github找到了一个解决方案,避免使用已弃用的对齐属性。它还避免了需要填充 。我制作了一个透明的1920x5 line.png,宽度="100%",并将其作为每一列的最后一行。每一列之间的空间相等。
||
|:--:|
| <img width=200px src="image.png" alt="image alt text"> |
| <img width="100%" src="line.png"> |
它在GitHub上为我工作
<p align="center">
<img src="...">
</p>
只要去Readme。Md文件并使用此代码。
<div align="center">
<img src=https://newfastuff.com/wp-content/uploads/2019/05/bW7QXVB.png" >
<p>Perfectly balanced</p>
</div>
<div align= " center " >[你的内容在这里]</div>适合页面中的所有内容,并根据页面的尺寸将其居中对齐。
我解决图像定位问题的方法是使用HTML属性:
{ width="800" height="600" style="display: block; margin: 0 auto" }
图像被正确地调整了大小和居中,至少在我本地的Visual Studio Community Markdown渲染器中是这样。
然后,我已经将更改推到存储库,不幸的是,我意识到它不适用于GitHub README。md文件。尽管如此,我还是留下这个答案,因为它可能会帮助其他人。
所以最后,我已经结束使用好的旧HTML标签代替:
<img src="Image.svg" alt="Image" width="800" height="600" style="display: block; margin: 0 auto" />
但你猜怎么着?一些JavaScript方法取代了我的样式属性!我甚至尝试了类属性和相同的结果!
然后我发现了以下要点页面,其中使用了更多的老式HTML:
<p align="center">
<img src="Image.svg" alt="Image" width="800" height="600" />
</p>
然而,这一个工作得很好,我想在没有进一步评论的情况下离开它…
“纯”Markdown方法可以处理这个问题,将图像添加到表格中,然后将单元格居中:
|  |
| :--: |
它应该生成类似这样的HTML:
<table>
<thead>
<tr>
<th style="text-align:center;"><img src="img.png" alt="Image"></th>
</tr>
</thead>
<tbody>
</tbody>
</table>