github README.md中心图像_markdown image center-优快云博客

本文翻译自：github README.md center image

I've been looking at the markdown syntax used in GitHub for a while but except resizing an image to the extent of the readme.md page, I can't figure out how to center an image in it. 我一直在看GitHub中使用的降价语法一段时间，但除了将图像调整到readme.md页面的范围外，我无法弄清楚如何将图像居中。

Is it possible? 可能吗？ If it is, how? 如果是的话，怎么样？

#1楼

参考：https://stackoom.com/question/OJhC/github-README-md中心图像

#2楼

I've been looking at the markdown syntax used in github [...], I can't figure out how to center an image 我一直在研究github [...]中使用的markdown语法，我无法弄清楚如何使图像居中

TL;DR TL; DR

No you can't by only relying on Markdown syntax. 不，你不能只依靠Markdown语法。 Markdown doesn't care with positioning. Markdown不关心定位。

Note: Some markdown processors support inclusion of HTML (as rightfully pointed out by @waldyr.ar), and in the GitHub case you may fallback to something like <div style="text-align:center"><img src="..." /></div> . 注意：某些降价处理器支持包含HTML（正如@ waldyr.ar所指出的那样），而在GitHub情况下，您可能会回退到类似<div style="text-align:center"><img src="..." /></div> 。 Beware that there's no guarantee the image will be centered if your repository is forked in a different hosting environment (Codeplex, BitBucket, ...) or if the document isn't read through a browser (Sublime Text Markdown preview, MarkdownPad, VisualStudio Web Essentials Markdown preview, ...). 请注意，如果您的存储库在不同的托管环境（Codeplex，BitBucket，...）中分叉，或者如果不通过浏览器读取文档，则无法保证图像将居中（Sublime Text Markdown预览，MarkdownPad，VisualStudio Web Essentials Markdown预览，...）。

Note 2: Keep in mind that even within the GitHub website, the way markdown is rendered is not uniform. 注意2：请记住，即使在GitHub网站内，呈现降价的方式也不统一。 The wiki, for instance, won't allow such css positional trickery. 例如，wiki不会允许这样的css位置欺骗。

Unabridged version 完整版

The Markdown syntax doesn't provide one with the ability to control the position of an image. Markdown语法不能提供控制图像位置的功能。

In fact, it would be borderline against the Markdown philosophy to allow such formatting, as stated in the "Philosophy" section 事实上，正如“哲学”部分所述，允许这种格式化将与Markdown哲学相悖

"A Markdown-formatted document should be publishable as-is, as plain text, without looking like it's been marked up with tags or formatting instructions. " “Markdown格式的文档应该像普通文本一样可以发布，而不是看起来像是用标签或格式说明标记的。”

Markdown files are rendered by github.com website through the use of the Ruby Redcarpet library. Markdown文件由github.com网站通过使用Ruby Redcarpet库呈现。

Redcarpet exposes some extensions (such as strikethrough, for instance) which are not part of standard Markdown syntax and provide additional "features". Redcarpet公开了一些扩展（例如删除线），它们不是标准Markdown语法的一部分，并提供额外的“功能”。 However, no supported extension allow you to center an image. 但是，没有支持的扩展名允许您居中图像。

#3楼

This is from Github's support: 这是来自Github的支持：

Hey Waldyr, 嘿Waldyr，

Markdown doesn't allow you to tweak alignment directly (see docs here: http://daringfireball.net/projects/markdown/syntax#img ), but you can just use a raw HTML 'img' tag and do the alignment with inline css. Markdown不允许您直接调整对齐（请参阅此处的文档： http ： //daringfireball.net/projects/markdown/syntax#img ），但您可以使用原始HTML'img'标记并与内联进行对齐CSS。

Cheers, 干杯，

So it is possible to align images! 所以可以对齐图像！ You just have to use inline css to solve the problem. 您只需使用内联css来解决问题。 You can take an example from my github repo . 你可以从我的github repo中拿一个例子。 At the bottom of README.md there is a centered aligned image. 在README.md的底部有一个居中对齐的图像。 For simplicity you can just do as follows: 为简单起见，您可以执行以下操作：

<p align="center">
  <img />
</p>

Although, as nulltoken said, it would be borderline against the Markdown philosophy! 虽然，正如nulltoken所说，它将与Markdown哲学相悖！

#4楼

This is quite simple really. 这真的很简单。

-> This is centered Text <-

So taking that in mind you can apply this to the img syntax. 因此，考虑到这一点，您可以将其应用于img语法。

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

#5楼

Alternatively, if you have control of the css, you could get clever with url parameters and css . 或者，如果你有控制css，你可以聪明地使用url参数和css 。

Markdown: 降价：

![A cute kitten](http://placekitten.com/200/300?style=centerme)

And CSS: 和CSS：

img[src$="centerme"] {
  display:block;
  margin: 0 auto;
}

You could create a variety of styling options this way and still keep the markdown clean of extra code. 您可以通过这种方式创建各种样式选项，并且仍然保持标记清除额外的代码。 Of course you have no control over what happens if someone else uses the markdown somewhere else but thats a general styling issue with all markdown documents one shares. 当然，如果其他人在其他地方使用markdown，你无法控制会发生什么，但这是所有降价文件的一般造型问题。

#6楼

It works for me on github 它适用于我在github上

<p align="center"> 
<img src="...">
</p>