Vuepressで使えるMarkdown記法一覧

新月一2021-02-09OtherVuepress Markdown

TIP

VuepressでMarkdown記法を使って記事を書いているので、使っていない記法とかないかなと思って一覧を調べてきました。主にQiitaの記事でチートシートを作ってくださっている方は多いのですが、vuepressではどないやろ、ということで備忘録もかねてMarkdown記法一覧を作っていきます。

本文のレイアウト

▼見出し

例)

# h1
## h2
### h3
### h4

実際

h1

h2

h3

h4


▼行間を開ける

例)

<br>
<br>

実際




▼引用

例)

>ここに引用する文章を書きます
>>入れ子にするならこうします

実際

ここに引用する文章を書きます

入子にするならこうします




※チェックボックスはvuepressでは使えないようです。 こうなっちゃいます)

- [] チェック1
- [x] チェック2

実際

  • [] チェック1
  • チェック2

▼リスト

例)

- リスト1
* リスト2
+ リスト3
1. 順序つきリスト1
2. 順序つきリスト2

実際

  • リスト1
  • リスト2
  • リスト3
  1. 順序つきリスト1
  2. 順序つきリスト2

▼水平線

例)ハイフンかアスタリスク三個以上

***
* * *
******
---
- - -
------

実際










▼強調

例)

*イタリック体*

**Bold体**

***イタリック&ボールド体***

_イタリック体_

__Bold体__

___イタリック&ボールド体___

実際

イタリック体

Bold体

イタリック&ボールド体

イタリック体

Bold体

イタリック&ボールド体


▼打ち消し

例)

~~打ち消し~~

実際

打ち消し

ちなみに、注釈はvuepressでは使えないようです。plugin使ったらわかりませんが。


リンク

▼自動リンク

例)

<https://sirenji-suiren.netlify.app>

実際

https://sirenji-suiren.netlify.appopen in new window


▼インライン記法

例)

[リンクのタイトル](https://sirenji-suiren.netlify.app)

実際

リンクのタイトルopen in new window


▼画像

例).vuepressディレクトリの中のpublicファイルが参照できるディレクトリです。

![画像のタイトル](/avatar.jpg)

実際

画像のタイトル


codeの記載

▼codeのインライン表記

例)

```print("Hello")```というふうに一行で

実際

print("Hello")というふうに一行で


▼シンプルなcodeの記載

例)うまくコードを表示できないので苦肉の策です。

`を三つ続けて打つ
print("やっほー")
`を三つ続けて打つ
print("やっほー")

▼シンタックスハイライトを使う場合

例)

`を三つ続けて打つPython
print("やっほー")
`を三つ続けて打つ

実際

print("やっほー")

Bash, C#(cs), C++(cpp), CSS, Diff, HTML, XML, Ini, Java, Javascript, PHP, Perl, Python, Ruby, SQL, 1C, AVR Assembler(avrasm), Apache, Axapta, CMake, DOS .bat(dos), Delphi, Django, Erlang, Erlang, REPL, Go, Haskell, Lisp, Lua, MEL, Nginx, Objective C(objectivec), Parser3, Python, profile, Scala, Smalltalk, TeX, VBScript, VHDL, Vala は上のコードのPythonに当たる部分をこの通りに記載すればシンタックスになります。


▼テーブル記法

例)

| Left align | Right align | Center align |
|:-----------|------------:|:------------:|
| This       |        This |     This     |
| column     |      column |    column    |
| will       |        will |     will     |
| be         |          be |      be      |
| left       |       right |    center    |
| aligned    |     aligned |   aligned    |

実際

Left alignRight alignCenter align
ThisThisThis
columncolumncolumn
willwillwill
bebebe
leftrightcenter
alignedalignedaligned

最後に

以上、Vuepressで使えるMarkdown一覧でした。参考リンクのほう載せておくので、Qiitaで記事を書く方にとってはそのほうが有益なtipsかもしれませんのでご参考ください。

そのうちにこのブログを立ち上げた技術についても記事書こうと思っています。

ではでは今日はこの辺で。


参考リンク

Wikipediaopen in new window

Markdown記法チートシートopen in new window

Markdown記法一覧open in new window

Markdown記法についてopen in new window

Last Updated 2023-04-16 05:02:26