Qiita記事投稿でよく使うHTMLタグのメモ

• Qiita記事投稿の際に頻繁に使うhtmlタグについて、自分用にメモを残しておきます。
• 基本的に、htmlなどのマークアップ言語をQiita記事の投稿に用いることができます。

【よく使うHTMLタグのメモ】

画像サイズ変更

<img src="" width=50%>

画像サイズ変更 ＋ alt属性付与

<img src="" alt="" width=50%>

アンカーリンク

<a href="URL">テキスト</a>

アンカーリンク（新しいタブで開く）

<a href="URL" target="_blank">テキスト</a>
例： Yahoo!

打ち消し線

<del> </del>

コードを表示

<code>コードを入力</code>
※これはQiitaで言うところの「``」と同じ。

文字色を指定する

<font color="SteelBlue">テキスト</font>
例：テキスト

引用ブロック

<blockquote cite="引用元URL"> <p>テキスト</p>< /blockquote>

イタリック

<em>おはよう</em>

ボールド

<p>hey guys <strong>hello world</strong> what's up?</p>

例： hey guys hello world what's up?

箇条書きリスト：マークアップ言語（html）の場合

<ul>
    <li>あああ</li>
    <li>あああ</li>
    <li>あああ</li>
</ul>

箇条書きリスト：マークダウン記法の場合

- [ ] タスク1
- [x] タスク2

• タスク1
• タスク2

テキストを折りたたむ

<details>
  <summary>見出し（以下のテキストが展開される）</summary>
  折りたたまれるテキストがここ
</details>

テーブル・表： こんな感じの表が作れる。コードは以下の通り

テーブル（表）を作成（クリックすると中身の内容が展開される）

<table>
    <thead>
        <tr>
            <th>id</th>
            <th>商品名</th>
            <th>数量</th>
            <th>金額</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>1</td>
            <td>焼肉定食</td>
            <td>1</td>
            <td>1000</td>
        </tr>
        <tr>
            <td>2</td>
            <td>生姜焼き定食</td>
            <td>1</td>
            <td>900</td>
        </tr>
        <tr>
            <td>3</td>
            <td>中華丼</td>
            <td>2</td>
            <td>1600</td>
        </tr>
    </tbody>
</table>

diffと他の言語のシンタックスを同時に使う

• ```diff_ruby```
• ```diff_ruby:ファイル名.rb```

ruby

def say_hello
- puts "hello"
+ puts "bye"
end

参考：diffと他の言語のシンタックスを同時に使う｜Markdown記法チートシート - Qiita

さいごに｜参考サイト

• Qiita記事投稿でよく使うHTMLタグのメモ

• Markdown記法 チートシート

• Qiitaのマークダウンで色をつける方法[140色]

• htmlタグを使ってPCキッティングチェックリストを作る