Skip to main content

基本的な書き方とフォーマットの構文

シンプルな構文を使い、GitHub 上で文章やコードに洗練されたフォーマットを作り出してください。

見出し

見出しを作成するには、1 つから 6 つの # シンボルを見出しのテキストの前に追加します。 使用する # の個数によって見出しのサイズが決まります。

# The largest heading
## The second largest heading
###### The smallest heading

表示された H1、H2、H6 のヘッディング

2 つ以上の見出しを使用すると、GitHub では自動的に目次が生成されます。この目次には、ファイル ヘッダー内の をクリックするとアクセスできます。 各見出しのタイトルが目次に一覧表示され、タイトルをクリックして選択したセクションに移動できます。

目次アイコンが強調表示されているスクリーンショット

テキストのスタイル設定

コメント フィールドと .md ファイルでは、太字、斜体、取り消し線、下付き、上付きのテキストで強調を示すことができます。

スタイル構文キーボード ショートカット出力
太字** ** または __ __Command+B (Mac) または Ctrl+B (Windows/Linux)**This is bold text**これは太字のテキストです
[斜体]* * または _ _    Command+I (Mac) または Ctrl+I (Windows/Linux)*This text is italicized*このテキストは斜体です
取り消し線~~ ~~~~This was mistaken text~~これは間違ったテキストでした
太字および太字中にある斜体** ** および _ _**This text is _extremely_ important**このテキストはきわめて重要です
全体が太字かつ斜体*** ******All this text is important***このテキストはすべて重要です
Subscript<sub> </sub><sub>This is a subscript text</sub>これは下付きテキストです
Superscript<sup> </sup><sup>This is a superscript text</sup>これは上付きテキストです

テキストの引用

> を使用してテキストを引用符で囲みます。

Text that is not a quote

> Text that is a quote

表示された引用テキスト

ヒント: 会話を表示するときに、テキストを強調表示して「R」と入力することで、コメント内のテキストを自動的に引用符で囲むことができます。 をクリックしてコメント全体を引用し、続いて返信を引用します。 キーボード ショートカットの詳細については、「キーボード ショートカット」を参照してください。

コードの引用

単一のバッククォートで文章内のコードやコマンドを引用できます。 バッククォート内のテキストはフォーマットされません。 また、Command + E キー (Mac) または Ctrl + E キー (Windows/Linux) のキーボード ショートカットを押して、Markdown 行内にコード ブロックのバッククォートを挿入することもできます。

Use `git status` to list all new or modified files that haven't yet been committed.

表示されたインラインのコードブロック

独立したブロック内にコードあるいはテキストをフォーマットするには、3 重のバッククォートを使用します。

Some basic Git commands are:
```
git status
git add
git commit
```

表示されたコードブロック

詳細については、「コード ブロックの作成と強調表示」を参照してください。

コード スニペットとテーブルを頻繁に編集する場合は、GitHub AE のすべてのコメント フィールドで固定幅フォントを有効にするとメリットが得られる可能性があります。 詳細については、「エディターで固定幅フォントを有効にする」を参照してください。

サポートされているカラー モデル

issue、pull request、ディスカッションでは、バックティックを使って文内の色を呼び出すことができます。 バックティック内でサポートされているカラー モデルでは、色の視覚化が表示されます。

The background color should be `#ffffff` for light mode and `#0d1117` for dark mode.

レンダリングでサポートされているカラー モデル。

現在サポートされているカラー モデルを次に示します。

Color構文出力
HEX`#RRGGBB``#0969DA`HEX 形式でレンダリングされたサポートされているカラー モデル。
RGB`rgb(R,G,B)``rgb(9, 105, 218)`RGB 形式でレンダリングされたサポートされているカラー モデル。
HSL`hsl(H,S,L)``hsl(212, 92%, 45%)`HSL 形式でレンダリングされたサポートされているカラー モデル。

注:

  • サポートされているカラー モデルでは、バックティック内の先頭または末尾にスペースを含めることはできません。
  • 色の視覚化は、issue、pull request、ディスカッションでのみサポートされます。

リンク

インライン リンクを作成するには、リンク テキストを角かっこ [ ] で囲み、URL をかっこ ( ) で囲みます。 また、キーボード ショートカット Command + K を使ってリンクを作成することもできます。テキストが選ばれている場合は、クリップボードから URL を貼り付けて、選択項目からリンクを自動的に作成できます。

This site was built using [GitHub Pages](https://pages.github.com/).

表示されたリンク

ヒント: GitHub AE では、コメント中に適正な URL が記述されていれば自動的にリンクが生成されます。 詳細については、「自動リンクされた参照と URL」を参照してください。

セクションリンク

セクションのヘッディング上にカーソルを移動させてリンクを表示させることにより、表示されたファイル中のセクションに対して直接リンクできます。

github/scientistリポジトリのREADMEファイル内のセクションリンク

表示されたファイル中で相対リンクと画像パスを定義して、読者がリポジトリ中の他のファイルにアクセスしやすくできます。

相対リンクは、現在のファイルに対する相対的なリンクです。 たとえば、リポジトリのルートに README ファイルがあり、docs/CONTRIBUTING.md に別のファイルがある場合、README の CONTRIBUTING.md への相対リンクは次のようになります。

[Contribution guidelines for this project](docs/CONTRIBUTING.md)

GitHub AEは相対リンクあるいは画像パスを、現在のブランチに基づいて変換するので、リンクやパスは常にうまく働きます。 リンクのパスは、現在のファイルに対する相対パスになります。 / で始まるリンクは、リポジトリ ルートに対する相対パスです。 ./../ のような相対リンクのオペランドをすべて使用できます。

相対リンクは、リポジトリをクローンするユーザにも扱いやすいです。 絶対リンクはリポジトリのクローンではうまく働かないかもしれません。リポジトリ内の他のファイルを参照するには、相対リンクを使うことをおすすめします。

画像

! を追加して、代替テキストを [ ] 内にラップすると、画像を表示できます。 次に、イメージのリンクをかっこ () で囲みます。

![This is an image](https://myoctocat.com/assets/images/base-octocat.svg)

レンダリングされたイメージ

GitHub AE では、問題へのイメージの埋め込み、プル要求、コメントと .md ファイルがサポートされます。 リポジトリからイメージを表示したり、オンライン イメージにリンクを追加したり、イメージをアップロードしたりできます。 詳細については、「アセットをアップロードする」を参照してください。

ヒント: リポジトリ内のイメージを表示する場合は、絶対リンクではなく相対リンクを使用する必要があります。

相対リンクを使用して画像を表示する例を次に示します。

Context相対リンク
同じブランチ上の .md ファイル内/assets/images/electrocat.png
別のブランチ上の .md ファイル内/../main/assets/images/electrocat.png
リポジトリの問題、プル要求、コメント内../blob/main/assets/images/electrocat.png?raw=true
別のリポジトリ内の .md ファイル内/../../../../github/docs/blob/main/assets/images/electrocat.png
別のリポジトリの問題、プル要求、コメント内../../../github/docs/blob/main/assets/images/electrocat.png?raw=true

: 上記の表の最後の 2 つの相対リンクは、ビューアーがこれらのイメージを含むプライベート リポジトリに対して、少なくとも読み取りアクセス権を持っている場合にのみ、プライベート リポジトリ内のイメージについて機能します。

詳細については、「相対リンク」を参照してください。

イメージが表示されるテーマの指定

HTML の <picture> 要素と prefers-color-scheme メディア機能を組み合わせて使って、Markdown で画像が表示されるテーマを指定できます。 淡色モードと濃色モードを区別するため、2 つのオプションを使用できます。 これらのオプションを使用して、暗い背景または明るい背景用に最適化された画像を表示できます。 これは、透明な PNG イメージの場合に特に有用です。

たとえば、次のコードでは、明るいテーマの太陽の画像と暗いテーマの月が表示されます。

<picture>
  <source media="(prefers-color-scheme: dark)" srcset="https://user-images.githubusercontent.com/25423296/163456776-7f95b81a-f1ed-45f7-b7ab-8fa810d529fa.png">
  <source media="(prefers-color-scheme: light)" srcset="https://user-images.githubusercontent.com/25423296/163456779-a8556205-d0a5-45e2-ac17-42d089e3c3f8.png">
  <img alt="Shows an illustrated sun in light mode and a moon with stars in dark mode." src="https://user-images.githubusercontent.com/25423296/163456779-a8556205-d0a5-45e2-ac17-42d089e3c3f8.png">
</picture>

URL に追加されたフラグメント (#gh-dark-mode-only または #gh-light-mode-only) を使うことでテーマに基づいて画像を指定する古い方法は非推奨となり、上記の新しい方法に置き換えられて削除されます。

リスト

1 つまたは複数の行の前に -*、または + を置くことで、順序なしリストを作成できます。

- George Washington
* John Adams
+ Thomas Jefferson

表示された順序なしリスト

リストを順序付けするには、各行の前に数字を置きます。

1. James Madison
2. James Monroe
3. John Quincy Adams

表示された順序付きリスト

入れ子になったリスト

1 つ以上のリストアイテムを他のアイテムの下にインデントすることで、入れ子になったリストを作成できます。

GitHub AE 上の Web エディター、または Visual Studio Code のようなモノスペース フォントを使用するテキスト エディターを使って、入れ子になったリストを作成するには、リストが揃って見えるように編集できます。 入れ子になったリスト アイテムの前に空白を、リスト マーカー文字 (- または *) が直接上位のアイテム内のテキストの一文字目の下に来るように入力してください。

1. First list item
   - First nested list item
     - Second nested list item

: Web ベースのエディターでは、最初に目的の行を強調表示し、次に Tab または Shift+Tab を使用して、1 行以上のテキストをインデントまたはデデントできます。

並びがハイライトされた入れ子になったリスト

2 レベルの入れ子になったアイテムを持つリスト

モノスペースフォントを使っていない GitHub AEのコメントエディタで入れ子になったリストを作成するには、入れ子になったリストのすぐ上にあるリストアイテムを見て、そのアイテムの内容の前にある文字数を数えます。 そして、その数だけ空白を入れ子になったリストアイテムの前に入力します。

この例では、入れ子になったリスト アイテムを少なくとも 5 つのスペースでインデントすることで、リスト項目 100. First list item の下に入れ子になったリスト アイテムを追加できます。First list item の前に 5 文字 (100. ) があるためです。

100. First list item
     - First nested list item

入れ子になったリストアイテムを持つリスト

同じ方法で、複数レベルの入れ子になったリストを作成できます。 たとえば、最初の入れ子になったリスト アイテムは入れ子になったリストコンテンツ First nested list item の前に 7 文字 (␣␣␣␣␣-␣)があるため、2 番目の入れ子になったリスト アイテムを 7 つのスペースでインデントする必要があります。

100. First list item
     - First nested list item
       - Second nested list item

2 レベルの入れ子になったアイテムを持つリスト

その他の例については、「GitHub 用の Markdown 仕様」を参照してください。

タスク リスト

タスク リストを作成するには、リスト アイテムの前に空白、ハイフン、[ ] を付けます。 完了したタスクをマークするには、[x] を使います。

- [x] #739
- [ ] https://github.com/octo-org/octo-repo/issues/740
- [ ] Add delight to the experience when all tasks are complete :tada:

表示されたタスクリスト

タスク リスト アイテムの説明がかっこで始まる場合、そのかっこを \ でエスケープする必要があります。

- [ ] \(Optional) Open a followup issue

詳細については、「タスク リストについて」を参照してください。

人や Team のメンション

@ とユーザー名またはチーム名を入力することで、人またはチームを GitHub AE でメンションできます。 これにより通知がトリガーされ、会話に注意が向けられます。 コメントを編集してユーザ名や Team 名をメンションすれば、人々に通知を受信してもらえます。 通知の詳細については、「通知について」を参照してください。

: ある人について、その人がリポジトリへの読み取りアクセス権をもっており、リポジトリが組織によって所有されている場合に、その人が組織のメンバーである場合にのみ、メンションに関する通知が送信されます。

@github/support What do you think about these updates?

レンダリングされた @mention

親チームにメンションすると、その子チームのメンバーも通知を受けることになり、複数のグループの人々とのコミュニケーションがシンプルになります。 詳細については、「Team について」を参照してください。

@ シンボルを入力すると、プロジェクト上の人々あるいはチームのリストが現れます。 このリストは入力していくにつれて絞り込まれていくので、探している人あるいは Team の名前が見つかり次第、矢印キーを使ってその名前を選択し、Tab キーまたは Enter キーを押して名前の入力を完了できます。 チームについては、@organization/team-name と入力すればそのチームの全メンバーにその会話をサブスクライブしてもらえます。

オートコンプリートの結果は、リポジトリのコラボレータとそのスレッドのその他の参加者に限定されます。

Issue およびプルリクエストの参照

# と入力して、リポジトリ内のサジェストされた Issue とプル要求のリストを表示させることができます。 Issue あるいはプルリクエストの番号あるいはタイトルを入力してリストをフィルタリングし、Tab キーまたは Enter キーを押して、ハイライトされた結果の入力を完了してください。

詳細については、「自動リンクされた参照と URL」を参照してください。

外部リソースの参照

カスタムの自動リンク参照がリポジトリに設定されているなら、JIRAのIssueやZendeskのチケットのような外部リソースへの参照は、短縮リンクに変換されます。 リポジトリで利用できる自動リンクを知るには、リポジトリの管理権限を持つ人に連絡してください。 詳細については、「外部リソースを参照する自動リンクの構成」を参照してください。

アセットをアップロードする

ドラッグアンドドロップ、ファイルブラウザから選択、または貼り付けることにより、画像などのアセットをアップロードできます。 アセットをリポジトリ内の Issue、プル要求、コメント、.md ファイルにアップロードできます。

絵文字の利用

:EMOJICODE: と入力 すると、絵文字を書き込みに追加できます。

@octocat :+1: This PR looks great - it's ready to merge! :shipit:

表示された絵文字

: と入力すると、絵文字のサジェストリストが表示されます。 このリストは、入力を進めるにつれて絞り込まれていくので、探している絵文字が見つかり次第、Tab または Enter を押して、ハイライトされているものを入力してください。

使用可能な絵文字とコードの完全な一覧については、「絵文字チート シート」を参照してください。

段落

テキスト行の間に空白行を残すことで、新しいパラグラフを作成できます。

脚注

次の角かっこ構文を使用して、コンテンツに脚注を追加できます。

Here is a simple footnote[^1].

A footnote can also have multiple lines[^2].  

You can also use words, to fit your writing style more closely[^note].

[^1]: My reference.
[^2]: Every new line should be prefixed with 2 spaces.  
  This allows you to have a footnote with multiple lines.
[^note]:
    Named footnotes will still render with numbers instead of the text but allow easier identification and linking.  
    This footnote also has been made with a different syntax using 4 spaces for new lines.

脚注は次のようにレンダリングされます。

レンダリングされた脚注

: Markdown 内の脚注の位置は、脚注がレンダリングされる場所には影響しません。 脚注を参照した直後に脚注を書き込むことができます。脚注は Markdown の下部に引き続きレンダリングされます。

脚注は Wiki ではサポートされていません。

コメントを使用してコンテンツを非表示にする

GitHub AE に対し、コンテンツを HTML コメント内に配置することで、レンダリングされた Markdown からコンテンツを非表示にすることができます。

<!-- This content will not appear in the rendered Markdown -->

Markdown のフォーマットの無視

GitHub AE に対し、Markdown のキャラクタの前に \ を使用することで、Markdown のフォーマットを無視 (エスケープ) させることができます。

Let's rename \*our-new-project\* to \*our-old-project\*.

表示されたエスケープキャラクタ

詳細については、Daring Fireball の「Markdown 構文」を参照してください。

Markdown レンダリングの無効化

Markdown ファイルを確認するときは、ファイルの上部にある をクリックすると、Markdown レンダリングを無効にして、代わりにファイルのソースを表示することができます。

Markdown とソースとして表示する

Markdown レンダリングを無効にすると、ライン リンクなどのソース ビュー機能を使用できます。これは、レンダリングされた Markdown ファイルを表示する場合には使用できません。

参考資料