17
5

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

[マークダウン] うろ覚え初心者のための復習シート(頻出まとめ)

Last updated at Posted at 2024-10-23

はじめに

駆け出しエンジニアの私が、最初に覚えたマークダウン記法を見やすくまとめてみました。
ここで紹介するマークダウン記法は、多くの環境で共通して使えるものです。
それでは参りましょう。



1. 見出し

# + 半角スペース から始まる行は見出しになります。
# の数が増えるにしたがって見出しは小さくなります。

マークダウン記入例(下に出力結果)
# 特大サイズの見出し
## 大きな見出し
### 中ぐらいの見出し
#### 小さめの見出し

特大サイズの見出し

大きな見出し

中ぐらいの見出し

小さめの見出し


2.引用

> から始まる行は引用になります。
> の数が増えるにしたがってネスト(入れ子)なります。

マークダウン記入例(下に出力結果)
> 引用マーク1つ
>> 引用マーク2つ

>>> 引用マーク3つ
>>>> 引用マーク4つ

引用マーク1つ

引用マーク2つ

引用マーク3つ

引用マーク4つ


3.コードブロック

[```] で該当部分を囲むことでコードブロックとして見なされます。

マークダウン記入例(下に出力結果)
```                                            (このカッコは省く)
ここにコードを書く
```                                            (このカッコは省く)
ここにコードを書く

4.インラインコード

[`] で該当部分を囲むことでインラインコードとして見なされます。

マークダウン記入例(下に出力結果)
文章の中に`インラインコード`を入れる。

文章の中にインラインコードを入れる。


5. 水平線

- を3つ続けて書くと、水平線を引くことができます。

マークダウン記入例(下に出力結果)
水平線を書くならハイフン3つが便利(文章をすぐ上に書くと文字は大きくなる)
---
---

水平線を書くならハイフン3つが便利(文章をすぐ上に書くと文字は大きくなる)



6.リスト

- + 半角スペース でリストの要素になります。

マークダウン記入例(下に出力結果)
- バナナ
- じゃがいも
- とうもろこし
  • バナナ
  • じゃがいも
  • とうもろこし

7. リンク

リンクにしたい文字列を[]で囲み、URLを()の中に記述することでリンクになります。

マークダウン記入例(下に出力結果)
[ここを押すとyahooに飛ぶ](https://www.yahoo.co.jp/)

ここを押すとyahooに飛ぶ


8. 文字(斜め・太字・打ち消し)

*によって囲まれた文字列は斜めになります。
**によって囲まれた文字列は太字になります。
***によって囲まれた文字列は斜めの太字になります。
~~によって囲まれた文字列は打ち消されます。

マークダウン記入例(下に出力結果)
一部の文字を「*斜め*」にしたい
一部の文字を「**太く**」したい
一部の文字を「***斜めかつ太く***」したい
右の文章を取り消したい「~~あああああ~~」

一部の文字を「斜め」にしたい
一部の文字を「太く」したい
一部の文字を「斜めかつ太く」したい
右の文章を取り消したい「あああああ


9. テーブル

|は列の区切りに使われます。
-は「列のタイトル」と「列の要素」の区切りに使われます。
デフォルトではマスの要素は左寄せですが、-の右端に「:」を付けることで右寄せに、両端を「:」で囲むこと中央寄せにすることができます。

マークダウン記入例(下に出力結果)
a|bb|ccc|dddd|eeeee
-|-|-|-:|:-:
あ|い|う|え|お
か|き|く|け|こ
a bb ccc dddd eeeee

10. チェックボックス

[ + 半角スペース + ]から始まる行はチェックボックスになります。
[ + x + ]から始まる行はチェック済みのチェックボックスになります。

マークダウン記入例(下に出力結果)
- [ ] まだ完了してない(だからといってクリックはできない)
- [x] 完了済み
  • まだ完了してない(だからといってクリックはできない)
  • 完了済み

11. プログラミング言語を指定したコードブロック

コードブロックを作成する際に、[```プログラミング言語名:ファイル名]とすることで、指定したプログラミング言語のハイライトをコードブロックに適用させることができます。

```typescript:ここにファイル名等                                (このカッコは省く)
let str: string = "hello";
```                                            (このカッコは省く)
ここにファイル名等
let str: string = "hello";

おわりに

環境によっては独自のルールに基づいた記号や、様々なhtml<タグ>を使い分けることで、より豊かな表現をすることが可能になります。

17
5
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
17
5

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?