Markdown 中心图像

Abdul Jabbar 2023年1月30日 2022年4月22日
  1. 在 Markdown 中对齐图像
  2. 在 Markdown 中如何居中对齐
Markdown 中心图像

Markdown 通常被称为轻量级标记语言,它在文本编辑器应用程序的帮助下将纯文本文档的格式元素包括在内。它是由 John Gruber2004 建立的。

这种语言现在已经成为世界上需求量最大的标记语言。我们现在可以找到许多专门用于在 Markdown 中写作的基于 Web 的应用程序。

Markdown 与 WYSIWYG 编辑器略有不同。正如在用于格式化单词和短语的 Microsoft Word 中所见,我们单击按钮以立即查看更改。

但是 Markdown 不遵循这一点。在 Markdown 中,当我们开发 Markdown 格式的文件时,Markdown 语法指定了一些在文本中应该不同的单词和短语。

本文将讨论如何在我们的 Markdown 文件中居中放置图像。例如,位于开源项目根目录的 README.md 文件在浏览器上显示为 HTML。

在 Markdown 中对齐图像

Markdown 有一种非常简单的方式来编写内容,而无需使用 WYSIWYG 编辑器进行格式化。

在 Markdown 中编写文本很快,但是对齐图像呢?

Markdown 图像标签本身没有任何对齐属性,当我们在 Github 上格式化 README.md 文件时,这非常烦人。

<!-- No alignment options -->
(/myimages/mylogo.png)

幸运的是,有办法解决这个问题。我们将使用 html 图像标签来使用 HTML 中的 img 标签来增强我们的文档。

.mdmarkdown 扩展名,它告诉我们 README.md 是一个降价文件。该文件用于创建我们在项目结束时看到的 html 摘要。

<img align="right" width="120" height="120" src="https://www.pexels.com/photo/photo-of-grey-tabby-kitten-lying-down-2558605/">

在 Markdown 中如何居中对齐

Markdown 中的中心对齐有点棘手。如下所示,我们必须将 img 标签包装在 p 标签中。

<p align="center">
  <img width="460" height="300" src="https://www.pexels.com/photo/photo-of-grey-tabby-kitten-lying-down-2558605/">
</p>
Author: Abdul Jabbar
Abdul Jabbar avatar Abdul Jabbar avatar

Abdul is a software engineer with an architect background and a passion for full-stack web development with eight years of professional experience in analysis, design, development, implementation, performance tuning, and implementation of business applications.

LinkedIn