编写基础内容

👁️ 预览

Markdown 是一种以干净简单的方式编写基本文本内容和格式的方法。Markdown .md 文件是纯文本文件，会在您生成的网站上转换为 .html 页面。

链接

到外部网站：

[链接文本](https://some-website.org/)

到您网站内的页面：

[认识我们的团队！](team)

上面的示例在大多数情况下都有效，因为您的网站可能只有顶级页面，并且 URL 是相对于当前页面的级别。如果您有子页面或更复杂的链接需求，请参见下文。

高级

您当然可以使用任何标准路径语法：

页面/照片位于与当前页面相同的文件夹中（即子页面）
[链接文本](page)
[链接文本](photo.jpg)

照片位于当前页面的子文件夹中
[链接文本](assets/photo.jpg)

照片位于当前页面上一级的文件夹中
[链接文本](../photo.jpg)

从网站根目录开始的页面/子页面
[链接文本](/page)
[链接文本](/page/sub-page)

但请注意，如果从根目录开始（上面的最后一个示例），您需要在“baseurl”前加上前缀，如果您设置的URL有一个（例如 your-lab.github.io/your-lab-website）：

手动添加 baseurl
[链接文本](/your-lab-website/page/sub-page)

Jekyll 自动添加正确的 baseurl
[链接文本]({{ "/page/sub-page" | relative_url }})
[链接文本]({% raw %}
{% link page/sub-page/index.md %}
{% endraw %})

Link parameters

The above section shows how you can write links as plain text content. But you will probably more often be linking to images/pages/whatever using the template's components, data lists, and front matters. In these cases, links work slightly differently.

You can still link to an external, absolute URL, e.g. https://some-website.org/. But if you are trying to link to something within your repo, the URL must start from the root of your repo, without any site name/"baseurl" prefix. You also cannot refer to files relative to the current file, or use the .. to move up folders.

✓ GOOD

{% include some-component.html image="images/photo.jpg" %}

---
image: https://some-website.org/journal-cover.jpg
---

- id: 123
  link: team/join

✘ BAD

{% raw %}
{% include some-component.html link="../images/photo.jpg" %}
{% endraw %}

---
image: ./image-in-current-folder.jpg
---

- id: 123
  link: /your-lab-website/team/join

Basic text styles

_italic text_

**bold text**

~~strike-through text~~

Line breaks

<br />
<br />
Text with extra blank lines above and below
<br />
<br />

Comments

<!-- a comment in HTML -->

{% raw %}
{% comment %}
A comment in Liquid
{% endcomment %}
{% endraw %}

Lists

- list item a
- list item b
- list item c

1. ordered list item 1
2. ordered list item 2
3. ordered list item 3

Images

![plain image](/images/photo.jpg)

For most purposes, prefer using the more richly featured (e.g. captions) and styled figure component instead.

Headings

# Heading 1

## Heading 2

### Heading 3

#### Heading 4

Horizontal rule

---

Table

With left-aligned, centered, and right-aligned columns.

| TABLE | Game 1 | Game 2 | Game 3 | Total |
| :---- | :----: | :----: | :----: | ----: |
| Anna  |  144   |  123   |  218   |   485 |
| Bill  |   90   |  175   |  120   |   385 |
| Cara  |  102   |  214   |  233   |   549 |

Block quote

> It was the best of times it was the worst of times.
> It was the age of wisdom, it was the age of foolishness.
> It was the spring of hope, it was the winter of despair.

Code block

With syntax highlighting.

```javascript
// a comment
const popup = document.querySelector('#popup')
popup.style.width = '100%'
popup.innerText = 'Lorem ipsum dolor sit amet.'
```

Inline code

This sentence has `inline code`, useful for making references to variables, packages, versions, etc. within a sentence.

Util classes

In Markdown, you can attach an arbitrary CSS class to an element with the syntax {:.class}. Depending on the type of element, this code may have to go on the same line or on the next line.

The template comes with a few alignment utility classes:

Lorem ipsum dolor sit amet.
{:.left}
Consectetur adipiscing elit.
{:.center}
Sed do eiusmod tempor incididunt.
{:.right}

Most things in the template are centered by default where appropriate, and left/right in a few other places where appropriate. But sometimes you may want to force the alignment of something.