如何在Markdown中实现右对齐和两端对齐?

152

Markdown文本始终左对齐。有没有办法在Markdown中实现右对齐和两端对齐?

更准确地说,我正在Jupyter Notebook(IPython)中使用Markdown。


1
据我所知,在Markdown中没有改变对齐方式的方法(这会使编译器/渲染器变得更加复杂)-也许有一些使用扩展语法的工具可以做到,但是现在我不知道有哪些(我认为甚至pandoc也不能做到)。 - Random Dev
1
你可以使用一些CSS来改变Markdown在浏览器中的对齐方式或HTML输出。然而,文本对齐不在Markdown本身的范围之内。 - Waylan
如果您使用HTML格式,您将无法在文本中使用.md格式。最佳答案在:https://dev59.com/x6rka4cB1Zd3GeqPYBTK 例如:你好,这是我的 text。 {: style="text-align: justify"} - user6867105
没有任何解决方案适用于我的Bitbucket自述文件。 - JPM
9个回答

160

纯粹的Markdown中无法对齐文本。但是,您可以使用内联HTML标签来对齐文本。

<div style="text-align: right"> your-text-here </div>

要调整对齐方式,请将上面的right替换为justify


7
它能起作用,但会破坏链接,比如 <div style="text-align: right"> [up](https://github.com/loretoparisi/CapsNet#CapsNet) </div> 这样的代码将不会被渲染成链接。 - loretoparisi
6
你可以在 ‍♂️ 中使用 <a href="https://your-site.com">你的链接</a> 标签。 - Fyodor
2
内嵌 HTML 经常会被 Linters 禁止。我建议在 Markdown 中避免使用内嵌的 HTML,在问题的答案中已经发布了我的建议。 - KargWare
不幸的是,GitHub在README.md文件中不支持此功能,但这仍然比其他答案更好,因为GitHub不仅无法对齐文本,而且还会直接在页面上呈现未识别的标记。 - Mike Nakis
1
@MikeNakis GitHub会去掉style属性,但您仍然可以使用align,它仍然有效:<div align="right">your-text-here</div> - Zach Bloomquist

54

如果你想在表单中右对齐,可以尝试以下方法:

| Option | Description |
| ------:| -----------:|
| data   | path to data files to supply the data that will be passed into templates. |
| engine | engine to be used for processing templates. Handlebars is the default. |
| ext    | extension to be used for dest files. |

https://learn.getgrav.org/content/markdown#right-aligned-text


24

如果您想在Jupyter Notebook中使用对齐功能,请使用以下语法:

<p style='text-align: justify;'> Your Text </p>

右对齐:

<p style='text-align: right;'> Your Text </p>

1
感谢您展示“justify”选项;其他帖子只谈论右对齐。这个选项似乎也可以很好地与“div”标签配合使用。太遗憾了,我只能接受一个答案 :) - Ébe Isaac
如果您需要像我一样对整个文档进行对齐,那么请在CSS中添加 p { text-align: justify; }。此外,您还可以为列表元素添加 ul { text-align: justify; } - impopularGuy

10
在通用的 Markdown 文档中,使用以下代码:

<style>body {text-align: right}</style>

或者

<style>body {text-align: justify}</style>

但是在 Jupyter 中似乎不起作用。

3
这个答案比得票最高的答案好得多。所提出的解决方案可以很好地使用MD标记。其他人都建议使用HTML语法,这违背了MD的初衷。 - Uzair

6
如下所述,markdown不支持右对齐文本或块。但是,HTML可以通过层叠样式表(CSS)实现该功能。可以在markdown中使用HTML元素,因此将您的“文本”包装在divp元素中,并根据需要添加css样式。
在我的Jekyll博客(它将MD呈现为HTML)上,我使用了一种在markdown中也有效的语法。要“终止”块,请在末尾使用两个空格或两个换行符。
当然,您也可以使用{:.right}添加css类,而不是直接使用css样式{:style =“text-align:right”}。 CSS类“right”可以通过(外部)CSS表单进行样式设置。
文本向右
{: style="text-align: right" }
This text is on the right

文本作为块

{: style="text-align: justify" }
This text is a block

2
也许你需要为初学者解释一下CSS类是什么以及如何使用它。而且我认为这只适用于Markdown的Kramdown版本。 - Santiago
2
@Santiago,您是对的,它只在将markdown生成为HTML时才起作用。 - KargWare

2
如果您想使用这个答案,我发现当您在MacOs上使用MacDown时,可以在文档开头添加<div style="text-align: justify">来使所有文本对齐并保持所有code格式。也许其他编辑器也适用,您可以尝试一下;)

由于某种原因,这仅适用于段落而非整个文档。我在Linux中使用Typora编辑器。 - lucian

2

我使用了

<p align='right'>Farhan Khan</p>

这对我在Google Colaboratory上运行有效。有趣的是,它在其他地方都不起作用?


1
这已经被弃用了:https://html.com/attributes/div-align/ https://strictquirks.nl/standards/deprecated-attributes.html#p - iconoclast

1
针对您使用Jupyter Notebook的情况:在未来的版本中,将会恢复指定表格列对齐方式的功能。(当前版本默认在所有地方右对齐。)
来自PR#4130
允许Markdown表格使用 :--,:--:,--: 语法指定对齐方式,同时仍然允许 --- 默认右对齐。此更改撤消了先前的更改(#2534的一部分),该更改从marked渲染器输出的呈现HTML中删除了对齐信息。明确一下,这不会更改右对齐默认设置,但会通过使用gfm表格对齐语法重新支持覆盖每列的对齐方式。...

0

如何将文本和超链接右对齐已经有了答案并标记为正确,但是如果您要在右对齐的文本中引用Jupyter Notebook中的某些内容,则需要使用Eradash's answer的修改版本。修改包括删除分割闭合括号>在链接文本之前添加一个新的空行。因此,如果您想将标题链接到目录表中,则还可以在同一块中添加一个右对齐的“目录”链接,以获得更好的笔记本美学和导航。

假设您有一个带有指向单元格标题的目录表,它在markdown中看起来像这样:

<a id='Contents'></a>
### Table of Contents
* [Project description](#Project)
* [Load Data](#Load)

后来,您有一个包含某些操作的左对齐标题和右对齐转到链接的单元格:

<a id='Load'></a>
#### Loading data
<div style="text-align: right"
     
[Go to table](#Contents)

这将给您一个左对齐的标题,带有右对齐的转到链接。您的下一个单元格将不需要任何对齐修改而直接跟随:

enter image description here

(我很好奇为什么这样做有效,因为这种解决方案似乎更像是一种hack而不是其他任何东西。)

附注:您可以在右对齐的链接文本后添加结束括号>甚至是结束标签</div>,但它只会在输出中添加另一行和一个突出显示的空格,这当然违背了美学目的:

enter image description here


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接