HTML
Markdown

Qiitaの記事編集方法

Qiitaでプログラミングの記録をしよう!と思い立ったはいいものの

文字の大きさや文字の色を変えたりする方法がわからない!

ということで今回はQiitaの記事を編集するにあたっての便利コマンド集をまとめます。


この記事を書いている段階で気が付きましたが、基本的なコマンドは編集画面の右上にある
image.png

image.pngを押すことで参照できるみたいです。

そこで今回は、?には書いてないけどよく使いそうだな〜というコマンドをメモします。


そもそも話

MarkdownやHTMLによって編集を行います。

  • Markdown Wiki
    • 軽量マークアップ言語(手軽に入力→サーバー側でHTMLやらに変換してくれる)
  • HTML Wiki
    • マークアップ言語(視覚表現や文章構造などを記述するための形式言語)

以下コマンドまとめ

入力内容をそのまま表示したいとき

半角スペースを4つ入れる
image.png

class Hoge
    def hoge
        print 'hoge'
    end

ラインを入れたい時

---
***
___
*    *    *



リンク

<http://qiita.com>
[Google先生](https://www.google.co.jp/)

http://qiita.com
Google先生

見出し

# H1タグ
## H2タグ
###### H6タグ

ちなみにH4だとこのぐらいのサイズ

文字の色を変える

HTMLで書きます  
<font color="Red">Red</font> 
<font color="Magenta">Magenta</font>
<font color="DeepSkyBlue">DeepSkyBlue</font>
<font color="DarkGray">DarkGray</font>

Red
Magenta
DeepSkyBlue
DarkGray

強調

_イタリック体_
__太字__

イタリック体
太字

打ち消し

~~打ち消し~~

打ち消し

箇条書き

- リスト1
□□□□- ネスト リスト1_1
    □□□□- ネスト リスト1_1_1
    □□□□- ネスト リスト1_1_2
□□□□- ネスト リスト1_2
- リスト2
- リスト3
  • リスト1
    • ネスト リスト1_1
      • ネスト リスト1_1_1
      • ネスト リスト1_1_2
    • ネスト リスト1_2
  • リスト2
  • リスト3

番号付きリスト

1. 番号付きリスト1
    1. 番号付きリスト1_1
    1. 番号付きリスト1_2
1. 番号付きリスト2
1. 番号付きリスト3
  1. 番号付きリスト1
    1. 番号付きリスト1_1
    2. 番号付きリスト1_2
  2. 番号付きリスト2
  3. 番号付きリスト3

引用

> お世話になります。xxxです。
> 
> よろしくお願いいたします。

お世話になります。xxxです。

よろしくお願いいたします。

折りたたみ▷

<details><summary>追加情報</summary>追加情報の内容</details>

追加情報追加情報の内容

リスト

<dl>
  <dt>やること</dt>
  <dd>掃除</dd>
  <dt>終わったこと</dt>
  <dd>買い物</dd>
</dl>
やること
掃除
終わったこと
買い物

コロンの位置で文字の位置を指定可能
| 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 align       |       Right align |    Center align    |
Left align Right align Center align
This This This
column column column
will will will
be be be
left right center
aligned aligned aligned

参考

Markdown記法 サンプル集