你如何在 Gitlab markdown 中将文本居中? [英] How do you center text in Gitlab markdown?
问题描述
在 Gitlab 将其降价引擎切换到 CommonMark 之后，向降价文件添加自定义样式等内容不再那么容易了.
After Gitlab switched its markdown engine to CommonMark it's no longer as easy to add things like custom styling to your markdown files.
我使用 Gitlab 已经有一段时间了，而且很长时间以来，我一直很喜欢我可以让我的 README.md 文件看起来多么漂亮，我的项目有一个居中的图标、标题和描述.当他们切换引擎时，我所有依赖于此类样式的降价文件看起来都非常糟糕.
I've used Gitlab for some time and for the longest time I've liked how nicely I could make my README.md file look, having a centered icon, title and description for my project. When they switched the engine all my markdown files that relied on having such stylings look really bad.
转换到 CommonMark 后如何在 Gitlab 中将文本居中?
How do I center text in Gitlab after the transition to CommonMark?
推荐答案
更新
我检查了我的一个旧项目，发现它已经居中.事实证明，CommonMark 还允许您在 <div> 标签上设置 align="center>！
所以，目前最简单的居中解决方案是(注意开头<div>后的空行:
So, the simplest solution for centering is currently (note the empty line after the opening <div>:
<div align="center">
# This is gonna be centered!
</div>
原创
唯一支持居中的 CommonMark html 对象(据我所知)是当您将表格单元格居中时.首先你可能想只做一个表格然后使用 align="center"，但是表格不会占据页面的整个宽度，所以你会得到一个小的页面左侧的表格，这并不能解决我们想要相对于页面而不是表格来居中的问题.
Original
The only CommonMark html object that supports centering (as far as I know) is when you center a table cell. First you might've thought about just making a table and then using align="center", but the table won't take up the entire width of the page, so you'd get a small table on the left hand side of the page, which wouldn't solve our problem of wanting to center stuff relative to the page rather than the table.
为了解决这个问题，我们将表格宽度(不使用带有内联样式标签的 CSS，因为在撰写本文时 CommonMark 不支持它)设置为一个较大的值，该值将占用超过页面总宽度.由于 Gitlab markdown 中表格的 max-width: CSS 属性是 100% 这意味着通过设置一个高得离谱的 width="" 我们实际上是通过仅使用允许的纯 html width="" 属性将表 width: 设置为 100%.
To get around this we set the table width (not using CSS with an inline style tag since it's not supported in CommonMark at the time of writing) to a large value that will take up way more than the total width of the page. Since the max-width: CSS property of tables in Gitlab markdown is 100% it means that by setting a ridiculously high width="" we're essentially setting the table width: to 100% by using only the allowed pure html width="" property.
如果放置在下面的降价，例如Gitlab 项目中的 README.md 将生成一个 100% 宽度的表格，其中包含居中的图像、标题和描述.最值得注意的部分是我们在表格中的 <td> 元素上设置了 width=9999".
The markdown below if placed in e.g. README.md in your Gitlab project will result in a 100% width table with a centered image, title and description. The most notable part is that we're setting width="9999" on the <td> element in the table.
<table align="center"><tr><td align="center" width="9999">
<img src="/icon.png" align="center" width="150" alt="Project icon">
# MyProject
Description for my awesome project
</td></tr></table>
... More content
您可以在下面看到一个示例，说明您的 README.md 文件如何使用上述降价在 Gitlab 上显示.
Below you can see an example of how your README.md file could look on Gitlab using the above markdown.
这篇关于你如何在 Gitlab markdown 中将文本居中?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
