使用 Markdown,如何将图像及其标题居中?
我想最终得到:
Hello there!
<image>
This is an image
Hi!
图像和文本 This is an image
位于页面中心的位置。我如何使用 Markdown 来实现这一点?
编辑:请注意,我希望将页面上的图像和文本水平居中。
I want to end up with:
Hello there!
<image>
This is an image
Hi!
Where the image and the text This is an image
are centered on the page. How do I accomplish this with Markdown?
Edit: Note that I'm looking to horizontally center the image and text on the page.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(8)
我想我只需要使用 HTML 来水平对齐任何内容。
所以我的代码看起来像这样:
I figured that I'd just have to use HTML where I want to horizontally align anything.
So my code would look like this:
我想我有一个简单的解决方案,只要您可以定义 CSS,就可以工作。它也不需要任何扩展或 HTML!首先是你的 Markdown 图像代码:
注意添加的 url hash #center。
现在在 CSS 中添加此规则:
您应该能够使用像这样的 url 哈希,就像定义类名一样。
要查看实际效果,请查看我的 JSFiddle 使用 SnarkDown 解析文本区域中的 MarkDown - https://jsfiddle.net /颤抖/6s30e8vr/
I think I have a simple solution that will work given that you can define CSS. It also does not require any extensions or HTML! First your markdown image code:
Note the added url hash #center.
Now add this rule in CSS:
You should be able to use a url hash like this, almost like defining a class name.
To see this in action, check out my JSFiddle using SnarkDown to parse MarkDown in a textarea - https://jsfiddle.net/tremor/6s30e8vr/
如果您使用的是 kramdown,您可以执行此操作
If you are using kramdown, you can do this
在 Mou(也许还有 Jekyll)中,这非常简单。
因此,考虑到这一点,您可以将其应用于 img 语法。
此语法不适用于仅实现 Daring Fireball 上记录的内容的 Markdown 实现。
In Mou (and perhaps Jekyll) this is quite simple.
So taking that in mind you can apply this to the img syntax.
This syntax doesn't work for Markdown implementations that implement only what is documented on Daring Fireball.
您需要一个具有定义高度的块容器,行高值相同,并且图像具有垂直对齐:中间;
它应该有效。
You need a block container with a defined height, same value for line-height and image with vertical-align:middle;
It should work.
我很惊讶没有人这样提到:
I'm surprised no one mentioned this way:
使用 kramdown (由 githubpages 使用)
或使用 @(Steven Penny) 的回复
With kramdown (used by githubpages)
Or using the response from @(Steven Penny)
这是一个简单的解决方案,不使用任何已弃用的标签或属性:
Here is a simple solution that does not use any deprecated tags or attributes: