Hello World

段落 Paragraph

英文段落 English

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris ut feugiat dui. Quisque bibendum ac mi et dignissim. Donec faucibus mi at enim dignissim rutrum. Fusce lobortis mi et dolor mattis venenatis. Aenean imperdiet, libero vitae rutrum iaculis, sem lacus tincidunt dolor, eget posuere est nulla eu erat. Etiam leo libero, laoreet at consectetur in, tincidunt in arcu. Donec interdum libero dui, a dapibus nunc maximus vel.

Nunc imperdiet varius elit non cursus. Aenean vel tellus nec dolor porta tincidunt at ac diam. Nullam id neque eros. Cras sed tempus nunc. Aenean turpis orci, pharetra nec congue sed, ultricies sed dui. Aliquam in mattis odio. Vivamus urna ante, fermentum id maximus ut, cursus vel metus. Phasellus viverra vel lacus et efficitur. Suspendisse pellentesque, massa a sagittis feugiat, tortor metus egestas ex, a fringilla dui est condimentum enim.

中文段落 Chinese with English

我采了你的花，呵，世界！I plucked your flower, O world! 我把它压在胸前，花刺伤了我。I pressed it to my heart and the thorn pricked. 日光渐暗，我发现花儿凋谢了，痛苦却存留着。When the day waned and it darkened, I found that the flower had faded, but the pain remained.

許多有香有色的花又將來到你這裏，呵，世界！More flowers will come to you with perfume and pride, O world! 但是我采花的時代過去了，黑夜悠悠，我沒有了玫瑰，只有痛苦存留著。But my time for flower-gathering is over, and through the dark night I have not my rose, only the pain remains.

文字装饰 Text Decoration

Emphasis, aka italics, with asterisks or underscores. Strong emphasis, aka bold, with asterisks or underscores. Combined emphasis with asterisks and underscores. Strikethrough uses two tildes. Scratch this.

链接 Link

I’m a link

I’m a link with text.

块引用 Blockquote

我采了你的花，呵，世界！I plucked your flower, O world！
我把它压在胸前，花刺伤了我。I pressed it to my heart and the thorn pricked.
日光渐暗，我发现花儿凋谢了，痛苦却存留着。When the day waned and it darkened, I found that the flower had faded, but the pain remained.
— Rabindranath Tagore, The Gardener: 57

Shortcode

Hugo Built-in Shortcode

Figure

Example figure input:

1

{{< figure src="in-front-of-lake-ontario.jpg" title="In Front of Lake Ontario" >}}

The rendered output looks like this:

The HTML looks like this:

1
2
3
4
5
6

<figure>
    <img src="in-front-of-lake-ontario.jpg"/>
    <figcaption>
        <h4>In Front of Lake Ontario</h4>
    </figcaption>
</figure>

Youtube

Example youtube input:

1

{{< youtube B0z5Eg6qDhE >}}

The rendered output looks like this:

Hugo Extended Shortcode

The admonition shortcode supports 12 types of banners to help you put notice in your page.

Markdown or HTML format in the content is supported.

列表 List

有序列表 Ordered List

1. first
2. second
   1. sub first
   2. sub second
      1. yet another first
3. third

无序列表 Unordered List

• first
• second
  • sub first
  • sub second
    • yet another first
• third

任务列表 Task List

• first
• second
  • sub first
  • sub second
    • yet another first
• third

代码 Code

行内代码 Inline Code

这是行内代码 code 。（建议输入行内代码时使用空格与正文分隔。）

This is inline code: code .

代码块 Code Block

1
2

print hello, world!
# comment here...

1
2

<h1>hello, world!</h1>
<p>copy this block by clicking the top right button</p>

1
2
3

public static void main(String[] args) {
    System.out.println("Hello world!");
}

1

console.log('hello, world!');

图片 Image

尺寸 Size

图例 Figure Caption

动图 GIF

表格 Table

水平分隔线 Horizontal Rule

标题 Heading

相邻 Sibling

一级标题 Heading 1

二级标题 Heading 2

三级标题 Heading 3

四级标题 Heading 4

五级标题 Heading 5

间隔 Separate

一级标题 Heading 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc maximus suscipit libero non blandit.

二级标题 Heading 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc maximus suscipit libero non blandit.

三级标题 Heading 3

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc maximus suscipit libero non blandit.

四级标题 Heading 4

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc maximus suscipit libero non blandit.

五级标题 Heading 5

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc maximus suscipit libero non blandit.