Markdown tips

Headings

# h1 heading

## h2 heading

### h3 heading

#### h4 heading

##### h5 heading

###### h6 heading

Example

h1 heading

h2 heading

h3 heading

h4 heading

h5 heading
h6 heading

Horizontal rule

---

Example


Emphasis

**Bold text**
_Italic text_
~~Strikethrough text~~

Example

Bold text

Italic text

Strikethrough text

Quotes

> Quotes can
>
> > be nested

Example

Quotes can

be nested

Lists

Unordered

- Lists
  - can be
    - indented
  - second level

Example

  • Lists
    • can be
      • indented
    • second level

Ordered

1.  It doesn't matter
1.  what number the line
1.  is prepended with

Example

  1. It doesn't matter
  2. what number the line
  3. is prepended with

Message containers

::: tip
This is a tip
:::

::: warning
This is a warning
:::

::: danger
This is a danger warning
:::

Example

TIP

This is a tip

WARNING

This is a warning

DANGER

This is a danger warning

You can also customize the title of the block:

::: danger STOP
Danger, do not proceed
:::

Example

STOP

Danger, do not proceed

[External link](https://google.com)

[Link with title](https://google.com 'Title')

[Relative link](/lt/)

[Relative link to a block](/contribute/)

[Relative link to a chapter](/contribute/markdown-tips.md)

[Relative link to a section](/contribute/markdown-tips.md#message-containers)

Example

External linkopen in new window

Link with titleopen in new window

Relative link

Relative link to a block

Relative link to a chapter

Relative link to a section

WARNING

Don't forget to close off relative links with a ´/´, otherwise you will get a 404.

Images

![Alt text](/icons/android-chrome-192x192.png 'Title')

Example

Alt text

Code

Inline

Inline `code` on the same line

Example

Inline code on the same line

Code block

```js
var foo = function (bar) {
  return bar++;
};
```

Example

var foo = function (bar) {
  return bar++;
};

Line highlighting in a code block:

```js{2,3}
const foo = bar => {
  bar++;
  console.log(bar);
};
```

Example

const foo = bar => {
  bar++;
  console.log(bar);
};

 
 

Emoji 🎉

:tada: :radio:

Example

🎉 📻

Vue components

In this project it is possible to use Vueopen in new window components inside markdown files

.vuepress/components/DoubleNumber.vue

<template>
  <div class="doubler">
    <h3>{{ number }}</h3>
    <button @click="double">Double</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      number: 1,
    };
  },
  methods: {
    double() {
      this.number = this.number * 2;
    },
  },
};
</script>

<style scoped>
.doubler {
  text-align: center;
}

button {
  color: #fff;
  font-size: 1.2rem;
  background-color: var(--c-brand);
  padding: 1.5rem;
  border: none;
}
</style>
<!-- *.md -->

<DoubleNumber />

Example

1

Tables

| Tables   |      Are      |  Cool |
| -------- | :-----------: | ----: |
| col 3 is | right-aligned | $1600 |
| col 2 is |   centered    |   $12 |

Example

TablesAreCool
col 3 isright-aligned$1600
col 2 iscentered$12