文档冒烟测试页面

此页面有两个目的

• 演示 Kubernetes 文档如何使用 Markdown
• 提供一个“冒烟测试”文档，我们可以用它来测试影响整个文档的 HTML、CSS 和模板更改。

标题级别

上面的标题是 H2。页面标题呈现为 H1。以下部分显示 H3-H6。

H3

这是 H3 部分。

H4

这是 H4 部分。

H5

这是 H5 部分。

H6

这是 H6 部分。

内联元素

内联元素显示在段落、列表项、警示或其他块级元素的文本中。

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

内联文本样式

• 粗体
• 斜体
• 粗斜体
• 删除线
• 下划线
• 下划线斜体
• 下划线粗体
• 下划线粗斜体
• 等宽文本
• 等宽粗体

列表

Markdown 对处理列表没有严格的规则。当我们从 Jekyll 迁移到 Hugo 时，我们破坏了一些列表。要修复它们，请记住以下几点

• 确保您将子列表项缩进2 个空格。

• 要结束一个列表并开始另一个列表，您需要在列表之间用一个新行上的 HTML 注释块，与左边界对齐。否则第一个列表不会结束，无论您在它和第二个列表之间放置多少空行。

无序列表

• 这是一个列表项。

• 这是同一列表中的另一个列表项。

• 您可以混合使用- 和 *。
  • 要创建一个子项，请缩进两个空格。
    • 这是一个子子项。再缩进两个空格。
  • 另一个子项。

• 这是一个新列表。使用 Hugo，您需要使用 HTML 注释来分隔两个连续的列表。HTML 注释需要在左边界。

• 无序列表可以在其中包含段落或块级元素。

  将内容缩进与第一个项目的第一个字母对齐。此段落和代码块与上面Bullet 中的第一个B 对齐。

  ls -l
  

  • 以及一些块级内容后的子列表

• 一个无序列表项可以包含一个有序列表。

  1. 编号子列表项 1
  2. 编号子列表项 2

有序列表

1. 这是一个列表项
2. 这是同一列表中的另一个列表项。您在 Markdown 中使用的数字不一定与最终输出中的数字相关。按照惯例，我们将它们保持一致。

1. 这是一个新列表。使用 Hugo，您需要使用 HTML 注释来分隔两个连续的列表。HTML 注释需要在左边界。

2. 有序列表可以在其中包含段落或块级元素。

   将内容缩进与第一个项目的第一个字母对齐。此段落和代码块与上面Numbered 中的N 对齐。

   ls -l
   

   • 以及一些块级内容后的子列表。尽管缩进更多，但它与上面的段落和代码块处于同一“级别”。

选项卡列表

选项卡列表可用于有条件地显示内容，例如，当需要记录多个选项时，这些选项需要不同的说明或上下文。

• 选择一个...
• 格式化选项卡列表
• 嵌套标题

echo 'Tab lists may contain code blocks!'

清单

清单技术上是无序列表，但项目符号被 CSS 抑制。

• 这是一个清单项
• 这是一个选中的清单项

代码块

您可以通过两种不同的方式创建代码块，方法是在代码块之前和之后用三对反引号包围代码块。仅对代码块使用反引号（代码围栏）。这使您能够指定封闭代码的语言，从而启用语法高亮显示。它也比使用缩进更可预测。

this is a code block created by back-ticks

反引号方法有一些优点。

• 它几乎每次都能正常工作
• 在查看源代码时，它更紧凑。
• 它允许您指定代码块的语言，以进行语法高亮显示。
• 它有明确的结束。有时，缩进方法会因空格有意义的语言（如 Python 或 YAML）而中断。

要指定代码块的语言，请将其直接放在第一个反引号组之后

ls -l

Kubernetes 文档代码块中使用的常见语言包括

• bash / shell（两者工作方式相同）
• go
• json
• yaml
• xml
• none（禁用块的语法高亮显示）

包含 Hugo 短代码的代码块

要显示如上例所示的原始 Hugo 短代码，并防止 Hugo 解释它们，请在< 和> 字符后直接使用 C 样式注释。以下示例说明了这一点（查看此页面的 Markdown 源代码）。

{{< alert color="warning" >}}This is a warning.{{< /alert >}}

链接

要格式化链接，请将链接文本放在方括号内，后面是括号中的链接目标。

• [Link to Kubernetes.io](https://kubernetes.ac.cn/) 或
• [Relative link to Kubernetes.io](/)

您也可以使用 HTML，但它不是首选。例如，<a href="https://kubernetes.ac.cn/">Link to Kubernetes.io</a>。

镜像

要格式化图像，请使用与链接类似的语法，但添加一个前导! 字符。方括号包含图像的替代文本。尝试始终使用替代文本，以便使用屏幕阅读器的人员可以从图像中获得一些益处。

要指定扩展属性，例如宽度、标题、标题等，请使用figure 短代码，它优先于使用 HTML <img> 标签。另外，如果您需要图像也是超链接，请使用link 属性，而不是像下面那样将整个图形包装在 Markdown 链接语法中。

即使您选择不使用 figure 短代码，图像也可以是链接。这次铅笔图标链接到 Kubernetes 网站。外部方括号包含整个图像标签，链接目标在末尾的括号中。

您也可以使用 HTML 用于图像，但它不是首选。

表格

简单表格每行包含一行，列由| 字符分隔。标题通过包含三个或更多- 字符的单元格与主体分隔。为了便于维护，请尝试使所有单元格分隔符保持一致，即使您需要使用额外的空格。

标题是可选的。任何由| 分隔的文本都将呈现为表格。

Markdown 表格在处理单元格内的块级元素（如列表项、代码块或多个段落）时会遇到困难。对于复杂或非常宽的表格，请使用 HTML。

使用 Mermaid 进行可视化

您可以使用Mermaid JS 可视化。Mermaid JS 版本在/layouts/partials/head.html 中指定

{{< mermaid >}}
graph TD;
  A-->B;
  A-->C;
  B-->D;
  C-->D;
{{</ mermaid >}}

产生

{{< mermaid >}}
sequenceDiagram
    Alice ->> Bob: Hello Bob, how are you?
    Bob-->>John: How about you John?
    Bob--x Alice: I am good thanks!
    Bob-x John: I am good thanks!
    Note right of John: Bob thinks a long<br/>long time, so long<br/>that the text does<br/>not fit on a row.

    Bob-->Alice: Checking with John...
    Alice->John: Yes... John, how are you?
{{</ mermaid >}}

产生

您可以在官方文档中查看更多示例。

侧边栏和警示

侧边栏和警示提供了一些方法来增强文本的视觉重要性。谨慎使用它们。

侧边栏

侧边栏在视觉上偏移文本，但没有警示的视觉突出性。

这是一个侧边栏。

您可以在侧边栏中包含段落和块级元素。

您甚至可以包含代码块。

sudo dmesg

警示

警示（注意、警告等）使用 Hugo 短代码。

包含

要将短代码添加到包含项中。

Katacoda 嵌入式实时环境